Skip to main content

Multiple jQuery Ajax Promises

If you're using jQuery and are doing multiple ajax calls - on a recent project there was a pyramid of doom loading in lots of templates. A cool technique to avoid this is to roll the ajax calls into a single promise.

The $.when method can take multiple promises so we can use that to pass in an array of promises by using .apply.

function all (deferredArray) {
  var promise = $.Deferred();
  $.when.apply($, deferredArray).then(function() {
    promise.resolve('All done');
  return promise;

all([$.ajax("/"), $.ajax("/"), $.ajax("/")])
  .done(function(result) {