I am trying to learn how to use ajax and i cant seem to figure out why the below code does not work. All it does is first create a valid XMLHttpRequest object when the page firsts loads and then inserts some text into a section of the pages div area.
Demo.js
var ajaxRequest; // The variable that makes Ajax possible!
function newRequest()
{
try
{
ajaxRequest = new XMLHttpRequest();
..
}
}
I call this by using the following:
Index.html
<script src="Demo.js" type="text/javascript"></script>
</head>
<body onload="newRequest()">
<div class="page_Disp">
</div>
I then try to load some text from a file into the page using the following JS Function:
Demo.js
function openPage()
{
ajaxRequest.onreadystatechange=function()
{
if (ajaxRequest.readyState==4 && ajaxRequest.status==200)
{
document.getElementById("page_Disp").innerHTML=ajaxRequest.responseText;
ajaxRequest.open("GET","ajax_info.txt",true);
ajaxRequest.send();
}
}
}
The above is called using the following html code:
<a onclick="openPage()">Load TXT</a>
Can anyone see the problem that causes the script to not load and insert the data from the .txt into the section?