Ajax Request

DescriptionJavascript snippet by - 11/21/10

This simple ajax request snippet allows you to load dynamic content using javascript and ajax techniques. Upload a file named ajax-test.php to the server and adjust the path if you put it somewhere other than the root. The output or html within the ajax-test.php file will show up in the target div on pressing the button. You can load text files or various other files using ajax.
<script type="text/javascript">
function ajaxLoadFile()
{
if(window.XMLHttpRequest) xmlhttp = new XMLHttpRequest();
else xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");//For Ie5+Ie6

xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState == 4 && xmlhttp.status == 200) document.getElementById("ajax-target-div").innerHTML = xmlhttp.responseText;
}
xmlhttp.open("GET","/ajax-test.php",true);
xmlhttp.send();
}
</script>

<div id="ajax-target-div">
<p>Text to be replaced by file loaded via Ajax</p>
</div>

<button type="button" onclick="ajaxLoadFile();">Load file with Ajax</button>
  • Share
Authored by: Adam J Nowak
http://hyperspatial.com

Comments and Feedback