Parallel Ajax Calls in Javascript/jQuery
Using jQuery.when (deferreds):
$.when( $.ajax("/req1"), $.ajax("/req2"), $.ajax("/req3") ).then(function(resp1, resp2, resp3){
// plot graph using data from resp1, resp2 & resp3
});
callback function only called when all 3 ajax calls are completed.
You can't do that using async: false
- the code executes synchronously, as you already know (i.e. an operation won't start until the previous one has finished).
You will want to set async: true
(or just omit it - by default it's true). Then define a callback function for each AJAX call. Inside each callback, add the received data to an array. Then, check whether all the data has been loaded (arrayOfJsonObjects.length == 5
). If it has, call a function to do whatever you want with the data.