Javascript in IE not following logic

I have been trying to change some of our notes forms to use AJAX techniques so there’s no page refreshes.

My code works correctly in Firefox, but IE seems like it refuses to follow my logic.

Here’s the code on a textbox I have in it’s onblur method.


for(count=1;count<=7;count++) {

currDate = ‘Date’ + count;

dateField = document.getElementById(currDate);

dateStr = dateField.value;

dayStr = middle(dateStr,‘/’, ‘/’);

monStr = strLeft(dateStr,‘/’);

yearStr = rightBack(dateStr,‘/’);

getSummary(15, yearStr, monStr, dayStr,‘Testing’, count);

}


here’s the code for getSummary:


function getSummary(numKey, yrKey, monKey, dayKey, objID, c) {

obj = document.getElementById(objID);

roundCount = c;

alert("Count is: "+c);

xmlhttp.open(“GET”, “/Tester.nsf/GetList?OpenAgent&number=” + numKey + “&year=” + yrKey + “&month=” + monKey + “&day=” + dayKey);

xmlhttp.onreadystatechange = function() {

if (xmlhttp.readyState == 4) {

  if (xmlhttp.status == 200) {

    var xmlResp = xmlhttp.responseXML;

    updateDocument( xmlResp );

  } else {

    alert ("An error has occured. Error " + xmlhttp.status);

  }

} else {

  alert("ReadyState: "+xmlhttp.readyState+" Count:"+c);

}

}

xmlhttp.send(null);

xmlhttp.close;

}


Where IE goes out of whack seems to be during the onreadystatechange function.

After showing the alert saying : ReadyState: 1 Count: 1, it goes back to the for loop and increases count by 1, showing another alert saying “Count is 2”, meanwhile the other three alerts say ReadyState: 2 Count: 1, ReadyState: 3 Count: 1. Once the readystate equals 4, the rest of my code goes thinking count is two.

This makes it look like it’s calling getSummary multiple times and almost like it waits while the code inside updateDocument is still running.

Firefox follows the code correctly, only increasing count when all the other code is finished.

Subject: Javascript in IE not following logic

I’ve added an alert after the onblur event calls getSummary, and if I don’t click that alert until the alerts for readystates are done, everything works correctly.

So I think if I can IE here while still haivng the other code finishing, it’ll be all good.

Sorry if I’m confusing anyone, I’m just confused myself.

Subject: Javascript in IE not following logic

possibly in IE requests are asynchronous by default, so it lets you to get out before the response has arrived, and in FF they are synchronous. Looks like it - never thought about this…

If this is the case use the third parm in open() to force synchronous handling. Or as a more elegant solution rewrite your code in some way that correctly handles asynchronous requests.

Subject: RE: Javascript in IE not following logic

Would you know how I can go about reconstructing my code for asynchronous requests?

Subject: RE: Javascript in IE not following logic

I’ve been spoiled with prototype ways of doing things. It’s much easier with it. But it could be done also in plain script. Basically each request is done by a separate XMLHttpRequest object and each onreadystatechange handler knows which request object it handles and which “count” it relates to.

Something like this:

function BindArguments(fn, arg1, arg2) {

return function () { return fn(arg1, arg2); };

}

Allows to create a different function for each request.

function handleResponse(xmlhttp, c) {

if (xmlhttp.status == 200) {

	var xmlResp = xmlhttp.responseXML;

	updateDocument( xmlResp, c); // here update will happen differently depending on the value of "c"

} else if (...) {

	// do something if there is an error?

    }

}

function getSummary(…){

var xmlhttp=new XMLHttpRequest();

...

xmlhttp.onreadystatechange = BindArguments (handleResponse, xmlhttp, c);

..

}

well, I hope this works… did not test it, but I think you get the idea. Then you can run your loop, start 15 asynchronous requests and handle them as they get returned. Instead of waiting around while they slowly return one by one.