Using Ajax routine in for loop only returns last result?

[adrianjfl]

Hi,

I'm not very good with javascript/ajax but managed to get this
example working:
http://www.dynamicdrive.com/dynamici...jaxroutine.htm

I've adjusted their getAjaxRequest function slightly to allow me to
specify where the result goes 'divtoupdate' which is just an
extra argument to the function.

What i'm trying to do now is have a button on a website that runs
a loop updating a number of DIVS, eg:

for (x in divs_to_update)
{
updatediv = divs_to_update[x];
ajaxpack.getAjaxRequest("example.php?id=" + updatediv, "", processGetPost, "txt", updatediv);
}

This works OK except only the last DIV in the loop actually
gets updated. I think this has something to do with the example
code using global objects or something.

Can anyone please suggest what I need to change to have each
call in the for loop actually actioned separately?

Thanks a million,
Adrian.

[acoder]

Welcome to TSDN!

Either wait for one to finish (check that readystate is 4) before making the next request or use a new object for the next request.

[adrianjfl]

Hi Acoder,

Thanks for your reply. I think a new object is the going to
be the answer. There's a line in the ajaxroutine.js
'var ajaxpack=new Object()'.

Do I need to somehow move all this code into my for
loop so it creates a new object each cycle? Can you
give me any tips on how that might work?

Alternatively how would do I get the scripts to sit
and wait until myajax.readyState == 4 ?

Thanks,
Adrian

[acoder]

It depends on whether you want the requests to run concurrently or not.

If they can run one after another, just wait for the readyState to equal 4 (ready). You can see how that's done in the examples. You use onreadystatechange to detect changes in the state. Call a function which checks that its 4. If it is, take the response and update the div, then make another request. You could make this generic by having an array and just taking the next one until there are no more array items.

As for the objects, there is a line:

ajaxpack.ajaxobj=createAjaxObj()

Now if you could add more ajaxobjs, you could make concurrent requests.

[adrianjfl]

opps - please see post below instead.

[adrianjfl]

It depends on whether you want the requests to run concurrently or not.

If they can run one after another, just wait for the readyState to equal 4 (ready). You can see how that's done in the examples. You use onreadystatechange to detect changes in the state. Call a function which checks that its 4. If it is, take the response and update the div, then make another request. You could make this generic by having an array and just taking the next one until there are no more array items.

As for the objects, there is a line:

ajaxpack.ajaxobj=createAjaxObj()

Now if you could add more ajaxobjs, you could make concurrent requests.

Hi, I'm still struggling to get either method working. I'm going with the sequential option (though concurrent would be better if it's easy to do) but this solution doesn't work.. Can you see where i'm going wrong? The last argument to my getAjaxRequest function is just the name of the div that gets updated with the response.. That's all working fine, just not in the loop!

var joblist = new Array('google','yahoo','msn');
 
process_all()
{
    // Count how many jobs there are to run still
    for (x in joblist)  { count++; }
 
    if(count>=1)
    {
         // Get a new job to run
         var job = joblist[count-1];
 
         // pop it off the list so we don't see it again
         joblist.pop();
 
         // Perform Search using AJAX call to PHP script
         ajaxpack.getAjaxRequest('search.php', '', processGetPost, 'txt', job);
 
         // On completion,  run the search again (on the next JS array item)
         ajaxpack.onreadystatechange=process_all();
     }
}
 

Thanks,
Adrian

[acoder]

If you're confident enough to use Ajax without a library/framework, this should be quite straightforward. It's not that difficult if you look at the tutorials in the Offsite Links thread (see sticky at top of this forum). Call a function and use

var ajaxobj = new XMLHttpObject(); //or whatever creates object

That should create a new object every time.