multiple ajax requests with jquery

Question

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.

Answer 1

Ok here is what I would try, I think you need a better way to log the time. I am not sure what you are doing now to test the times but here is a good way.

Get Firebug for Firefox if you haven't already done so.

Open Firebug and go to the net tab. Make sure you enable it.

As you click each button you should see each request coming in. If you click each button, you don't see the next request starting until the previous request has ended then this tells me there is something wrong in javascript. However, I am guessing you should the beginning of each bar to be 1 second apart. Do this and let us know what you see.

Edit

I think I found you problem. I am guessing you are using sleep function in php. The sleep function sleeps for the current session. If you open up 3 tabs, and put the ajax url, you will notice the same behavior. 5, 10, then 15s for each tab to finish. I tried googling and found the same results with other people. This is probably because PHP is not really multithreaded. I suggest using a different framework.

Answer 2

Apparently this behaviour is very easily passable by using session_write_close(); in PHP. However, this opens up for DDos attacks with ease. I refreshed a page by holding down F5 in 10 seconds and killed my developmen computer in no-time.

Case closed.