If you know how many Ajax-Calls you have, simply use $.when()
$.when(doAjax('a'),doAjax('b'),doAjax('c'),doAjax('d'))
.then(function(result_a,result_b,result_c,result_d) {
console.log("Result from query a: " + result_a);
console.log("Result from query b: " + result_b);
console.log("Result from query c: " + result_c);
console.log("Result from query d: " + result_d);
});
If you don’t know how many ajax-calls you will have, you can manage the deferred objects by yourself.
// altered version of doAjax()
function doAjax(number,dObject) {
var xdata = {json: $.toJSON({name: number}), delay: 1};
$.ajax({
url:"/echo/json/",
data:xdata,
type:"POST",
success: function(data) {
results.push(data);
dObject.resolve();
}
});
}
// array that will contain all deferred objects
var deferreds = [];
// array that will contain all results
var results = [];
// make the ajax calls
for (var i = 0; i < someNumber; i++) {
var dObject = new $.Deferred();
deferreds.push(dObject);
doAjax(i,dObject);
}
// check if all ajax calls have finished
$.when.apply($, deferreds).done(function() {
console.log(results);
});
The magic comes with the function apply() which makes an array to arguments for a function.