multiple ajax requests with jquery
- by Emil
I got problems with the async nature of Javascript / JQuery.
Lets say the following (no latency is counted for, in order to not make it so troublesome);
I got three buttons (A, B, C) on a page, each of the buttons adds an item into a shopping cart with one ajax-request each.
If I put an intentional delay of 5 seconds in the serverside script (PHP) and pushes the buttons with 1 second apart, I want the result to be the following:
Request A, 5 seconds
Request B, 6 seconds
Request C, 7 seconds
However, the result is like this
Request A, 5 seconds
Request B, 10 seconds
Request C, 15 seconds
This have to mean that the requests are queued and not run simultaneously, right? Isnt this opposite to what async is? I also tried to add a random get-parameter to the url in order to force some uniqueness to the request, no luck though.
I did read a little about this. If you avoid using the same "request object (?)" this problem wont occure. Is it possible to force this behaviour in JQuery?
This is the code that I am using
$.ajax(
{
url : strAjaxUrl + '?random=' + Math.floor(Math.random()*9999999999),
data : 'ajax=add-to-cart&product=' + product,
type : 'GET',
success : function(responseData)
{
// update ui
},
error : function(responseData)
{
// show error
}
});
I also tried both GET and POST, no difference.
I want the requests to be sent right when the button is clicked, not when the previous request is finnished. I want the requests to be run simultaneously, not in a queue.
