ARTICLE
Load External File to an HTML Element Asynchronously using jQuery
Here I have used the jQuery AJAX method load() to show the external text file content to a DIV element.
Here I have used the jQuery AJAX method load() to show the external text file
content to a DIV element.
Here is the load() method syntax:
$(html element).load(url,data,callback)
url: specify the path
data: use the data parameter to data to server
callback : to trigger a function after completion
Try out the below code to get more idea about this functionality.
Step 1: Place a text file in the root (say 'SampleText.txt') and add some
content.
Step 2: Add this in the Head section.
<script type="text/javascript" src="./js/jquery-1.4.4.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("button").click(function(){
$("div").load('SampleText.txt',success);
});
function success()
{
alert("data loaded successfully");
};
});
</script>
Step 3: Add this in the body section
<body>
<div>
<h2>Click
on the below button to load the content from external text file</h2></div>
<button>Load
Content</button>
</body>
PFA the working application !!
Thanks
Shinu