Question

I have multiple ajax calls firing on page load.

From request1 I expect response1, and from request2 I expect response2. But I receive response1 for both request1 and request2.

When I move request2 to fire after response1 has been recieved then I recieve request2 as expected.

How can I do multiple ajax calls safely?

some code:

//avoids problem
    this.update = function(){
        $.post('/ws/newsfeed/', {'action':'6'}).done( function(response){
            ...
            _this.get_alert_count()
        })
    }

    this.get_alert_count = function(){
        $.post('/ws/newsfeed/', {'action':'2'}).done(function(count) {
            ...
        })
    }

_this.update()

//causes problem
    this.update = function(){
        $.post('/ws/newsfeed/', {'action':'6'}).done( function(response){
             ...
        })
    }

    this.get_alert_count = function(){
        $.post('/ws/newsfeed/', {'action':'2'}).done(function(count) {
            ...
        })
    }

_this.update()
_this.get_alert_count()

Answer 1

You may want to investigate AjaxQ (http://code.google.com/p/jquery-ajaxq/), it lets you chain ajax calls without overlapping in a given time.

Hope it helps