A
callback
is a function go as a argument to other function. In the event that client has more than one AJAX assignment in a site, client ought to make the single function for implementing the XMLHttpRequest protest, and one callback work for every AJAX undertaking. The call of the function ought to contain the URL and what capacity to call when the reaction is prepared. The following is an example.
[html]
<!DOCTYPE html>
<html>
<body bgcolor="skyblue">
<div id="demo">
<h1>Welcome To SPlessons</h1>
<h2>The XMLHttpRequest Object</h2>
<button type="button" onclick="loadDoc('ajax_info.txt', myFunction)">Splessons Info</button>
</div>
<script>
function loadDoc(url, cFunction) {
var xhttp;
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
cFunction(this);
}
};
xhttp.open("GET", url, true);
xhttp.send();
}
function myFunction(xhttp) {
document.getElementById("demo").innerHTML = xhttp.responseText;
}
</script>
</body>
</html>
[/html]
The
onreadystatechange
function will be put away and will be called naturally every time readyState property changes.
The
XMLHttpRequest
protest is utilized to trade information with a server. This implies it is conceivable to overhaul parts of a page, without disturbing the entire page.
The
readystate
essentially implies that the demand has got done with preparing.
200 is the http status for OK.
The
getElementById()
strategy gives back the component that has the ID quality with the predetermined esteem. This strategy is a standout amongst the most widely recognized strategies in the HTML DOM, and is utilized practically every time user need to control, or get information from, a component on the archive.
Output: Now compile the code result will be as follows.