Wait for multiple ajax calls?

Question

I got multiple ajax calls when my page loads, and I want to do something when all of them are finished, but I don't know when they are all finished

Is it possible to know, if so, how?

Thanks

$(document).ready(function () {
    getStuff();
    getStuff2();
    getStuff3();
})

function getStuff() {
$.ajax({
    url: '/Link/To/Stuff',
    type: 'GET',
    success: function () {
        console.log('Success');
    }
});
}

 ....more functions like getStuff2(), getStuff3()    etc

Showing the relevant source code would be a start. Please edit your question with the relevant source code, display any attempt(s) you have made and explain the problem. — NewToJS, Apr 18 '15 at 02:48
This exact scenario was described on css-tricks - take a look at the last code example on this post: https://css-tricks.com/multiple-simultaneous-ajax-requests-one-callback-jquery/ — Bradley4, Apr 18 '15 at 04:42

score 1 · Answer 1 · answered Apr 18 '15 at 02:49

If you're using jQuery you can use jQuery Deferred/Promises otherwise you could use another Promises implementation and write a wrapper around it; however, jQuery would be the quickest way to go for this.

Take a look at the documentation here: http://api.jquery.com/jquery.ajax/ It looks like as of v1.5, promises are available.

Then use this call to wait for all of the calls to finish up: https://api.jquery.com/jquery.when/

Wait for multiple ajax calls?

1 Answers1