Problem:
Trying to call the same Ajax function twice on initial load of the page, but only the second one executed.
I try to load mainpage, and inside mainpage I try to use ajax to load content1.asp to div1 and content2.asp to div2.
Test scenario (based on the [B]Situation
– Page loaded, 1st ajax function skipped, 2nd ajax function loaded
– Remarked 1st ajax function, then 2nd ajax function loaded
– Remarked 2nd ajax function, then 1st ajax function loaded
– Moved the 2nd ajax function to above 1st ajax function, the 2nd ajax function is skipped.
Conclution:
– the 1st ajax function always skipped. But Why? How to ensure both ajax is called upon loading of the page?
What is the problem?
[B]Situation:
[B]mainpage.asp
<div id=”div1″></div>
<div id=”div2″></div>
<script language=”JavaScript1.2″>
ajax(‘div1’, ‘GET’, ‘page1.asp’);
ajax(‘div2’, ‘GET’, ‘page2.asp’);
</script>
[B]ajax.js –
function ajax(strDivID, strMethod, strURL)
{
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById(strDivID).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open(strMethod,strURL,true);
if (strMethod=”POST”)
{
xmlhttp.setRequestHeader(“Content-type”,”application/x-www-form-urlencoded”);
}
xmlhttp.send();
}