Using JQuery $.when with dynamic number of requests

Question

I have a dynamic number of .get requests that I am using .when to wait until they complete so that I can work with all of their responses

// function that returns the response of a get request
function getRecipe(recipeID){            
  var url2 = 'https://api.pearson.com/kitchen-manager/v1/recipes/'+recipeID;
  return $.get(url2);
}

// function that loops through an unknown sized array and calls the getRecipe function for each one and adds the request to a requests array
function getAllRecipes(recipes_array){
  var requests = [];
  for (var i = 0; i < recipes_array.length; i++) {
    var recipeID = recipes_array[i];
    requests.push(getRecipe(recipeID));
  } 

  // this is where I would like to wait for all of the requests to come back so I am trying to use $.when

}

Without a dynamic number of requests I would structure it something like this

    $.when( d1, d2, d3 ).done(function ( v1, v2, v3 ) {
       // v1, v2, and v3 are the return responses from each request
    });

And v1, v3, and v3 should be the returned value from each request

I have tried the following with no luck...

  $.when(requests).done(function(stuff) {

    // stuff returns an array of the correct number of objects but not the returned values, just objects
    // $.type(stuff[0]) == object
  }

As well as ...

  $.when.apply($, requests).then(function(stuff) {
    // stuff returning 3 items in an array
    // item 1 is the response from the last request
    // item 2 is a string "success"
    // item 3 is an object

  }

How can I access all of the requests responses when they are dynamic?

I have referenced the following to get this far:

Wait until all jQuery Ajax requests are done?

How do you work with an array of jQuery Deferreds?

The last version looks OK (although it's unclear if you really want `then` or if `done` is enough), but what exactly is the contents of `requests`? Have you verified the correct value is going in? — Jon, Jul 19 '15 at 01:15

charlietfl · Accepted Answer · 2015-07-19T01:18:06.990

2

Can loop over arguments and will contain an array for each ajax call. This way you don't need to know how many requests were made

$.when.apply(null,requests).then(function(){
    // in javascript arguments  exposed by default and can be treated like array
    $.each(arguments, function(i,row){
      var status = row[1], data = row[0];
      if(status === 'success'){
        //do something with data
      }          
    });
});

Similarly could create a for loop based on arguments.length

DEMO

edited Jul 19 '15 at 01:18

answered Jul 19 '15 at 01:12

charlietfl

170,828
13
121
150

Thank you @charlietfl that was what I needed! Do you know where there is documentation on arguments in this scenario? – MicFin Jul 19 '15 at 01:20
@MicFin not really...seems to be lacking from a lot of these types of answers also. Keep in mind can do this for any function if you're not sure what are packed in arguments – charlietfl Jul 19 '15 at 01:21

Using JQuery $.when with dynamic number of requests

1 Answers1