$.when with arbitrary number of deferred objects?

Question

I have an arbitrarily-size array of urls I need to do AJAX requests to:

var urls = [
  "www.whatever.com",
  "www.somesite.com/some/path"
];

I need to make AJAX requests to them and output their response to the DOM in the same order as they were specified in the array. I thought this would be a perfect use case for jQuery's $.when().

var promises = [];
for (index in urls) {
  promises.push($.ajax(urls[index]));
}
$.when(promises).done(function(data){ // <--- I guess you can't do this?
  // do something 
});

But according to the documentation, you have to pass the deferred functions to it using a comma delimited list.

$.when( $.ajax( "/page1.php" ), $.ajax( "/page2.php" ) )
  .then( myFunc, myFailure );

This forces you to hard code the number of deferred objects you are sending. In my case, the number of items in my array changes from page to page. Is it possible to pass an array of ajax requests to $.when() so that the number of ajax requests I send doesn't matter?

You can try `$.when.apply($, promises).then(function(responses)` — tymeJV, Nov 23 '15 at 20:52
yup, the same way you would pass an array of values into any function you are calling: .apply. — Kevin B, Nov 23 '15 at 20:52

score 3 · Accepted Answer · answered Nov 23 '15 at 20:53

Instead of $.when(promises) you'll need to make use of Function.prototype.apply as $.when.apply($, promises)

Note that this also means that your then callbacks will likely need to make use of the arguments collection to access the relevant results for each deferred.

$.when with arbitrary number of deferred objects?

1 Answers1