This JavaScript program shows the ready state changes that occur during an AJAX call.
<!DOCTYPE html> <html> <head> <title>XoaX.net's Javascript AJAX Example</title> <style> #XoaxDiv { width:500px; background-color:Beige; margin:10px; padding:20px; } </style> </head> <body> <script type="text/javascript" src="AjaxReadyStateChanges.js"></script> <h1>Ready State Changes</h1> <div id="XoaxDiv"><p>Fill this with the text from XoaX.net's text file.</p></div> <button type="button" onclick="LoadXoaxAjaxFile()">Load XoaxAjax.txt</button> </body> </html>
function LoadXoaxAjaxFile() {
var qHttpReq;
if (window.XMLHttpRequest) {
qHttpReq=new XMLHttpRequest();
// Clear the Div First
document.getElementById("XoaxDiv").innerHTML="";
}
qHttpReq.onreadystatechange=function() {
document.getElementById("XoaxDiv").innerHTML+="State Changed:<br />";
document.getElementById("XoaxDiv").innerHTML+="Ready State = "+qHttpReq.readyState+"<br />";
document.getElementById("XoaxDiv").innerHTML+="Response Text = "+qHttpReq.responseText+"<br />";
document.getElementById("XoaxDiv").innerHTML+="Response XML = "+qHttpReq.responseXML+"<br />";
document.getElementById("XoaxDiv").innerHTML+="Status = "+qHttpReq.status+"<br />";
document.getElementById("XoaxDiv").innerHTML+="Status Text = "+qHttpReq.statusText+"<br />";
document.getElementById("XoaxDiv").innerHTML+="<br /><br />";
}
qHttpReq.open("GET","XoaxAjax.php",true);
qHttpReq.send();
}
<?php echo "XoaX.net GET text has been received."; ?>
© 20072024 XoaX.net LLC. All rights reserved.