Strange AJAX Behavior

[GLSmyth]

I am not certain how much code is needed to explain this oddity so I will try to keep it to a minimum, as the resolution may be something obvious I am missing.

I am writing a feed reader and have the feed summary information within one div and the feed information within another. The feed summary information shows the number of unread messages. When I click the "Mark As Read" link in the feed information, the appropriate row in the database is updated, an alert box pops up announcing that the item has been marked as read, and the feed summary information is read and displayed.

Here is the abbreviated code:

function MarkRead(Item, Feed, Flag) {
  URL = 'MarkRead.asp?I=' + Item + '&F=' + Flag;
  xmlHttp.open('get', URL, true)
  xmlHttp.onreadystatechange = UpdatePage;
  xmlHttp.send(null);
  ReadFromDatabase(Feed)
alert("Item marked as read.");
  UpdateSummary();
}

function UpdatePage() {
  if (xmlHttp.readyState == 4) {
    var response = xmlHttp.responseText;
    document.getElementById('FeedDisplay').innerHTML = response;
  }
}

function ReadFromDatabase(Feed,ReadAll) {
  URL = 'ReadFromDatabase.asp?F=' + Feed + '&RA=' + ReadAll;
  xmlHttp.open('get', URL, true)
  xmlHttp.onreadystatechange = UpdatePage;
  xmlHttp.send(null);
}

function UpdateSummary() {
  URL = 'ReadSummary.asp'; // Only get the most recent 100 items
  xmlHttp.open('get', URL, true)
  xmlHttp.onreadystatechange = UpdateSummarySection;
  xmlHttp.send(null);
}

function UpdateSummarySection() {
  if (xmlHttp.readyState == 4) {
    var response = xmlHttp.responseText;
    document.getElementById('SummaryInfo').innerHTML = response;
  }
}

This works just fine.

The alert box, oddly enough, appears to be a necessary element. If I remove the alert box then the information is not written to the feed information section. I can also put the alert box within the ReadFromDatabase() function and everything works fine. However, removing it returns me to the original problem.

Any ideas what might be going on here? I am in the process of learning AJAX and apparently I am missing something somewhere.

Whatever help can be offered would be greatly appreciated.

Cheers -

george

[JPnyc]

this is a longshot but try putting a semicolon after this line, ReadFromDatabase(Feed);
I know JavaScript is not a strongly typed language, but I have seen instances in which the omission of a semicolon, particularly when it's included on every other line, has caused problems.

[Razee Marikar]

You are reusing the same xmlHttp variable for all requests. So, what happens is, before you get the response of the xmlHttp, you have changed the handler and just about everything for that XMLHttpRequest object. You should make separate objects for each call, and wait for the response of one request before you issue the next one. To do that, instead of calling all the methods (the ReadFromDatabase and UpdateSummary) in the first function, call these from the onsuccess handlers of the previous call.