AJAX Promises using Array

Question

I'm trying to make several AJAX calls (let's say 2) using promises. Basically I want to be able to merge the two responses together, perform some analysis on them as a whole, then spit out a response. Right now, I have:

var responseArray = [];
for (var i=0; i<letsSayTwo; i++) {
  responseArray.push(someAjaxCall(data));
};
responseArray.done(function(response) {
  var spit = someAnalysis(response);
  console.log(spit);
});
responseArray.fail(function(response) {
  console.log('fail');
});

As it stands, I'm getting an "Uncaught TypeError: Object [object Array] has no method 'done'" error in console. Am I correct in thinking that I can't use this method? I looked into using the following bit of code from (http://gregfranko.com/blog/jquery-best-practices/) but I can't seem to get the response that I need.

$.when.apply(this, responseArray).then(function(response) {
  console.log(response);
});

Instead, what I get is [response, "success", response] where the first response is the correct return response for one of the AJAX calls and the last response is the actual call itself. How should I go about getting the correct responses from both AJAX calls??

I hope this all makes sense. Thanks!

Try following the example in the $.when() documentation : api.jquery.com/jQuery.when — Beetroot-Beetroot
– Beetroot-Beetroot, Commented Sep 30, 2013 at 8:01

Bergi · Accepted Answer · 2015-09-10 15:06:46Z

2

As it stands, I'm getting an Uncaught TypeError: Object [object Array] has no method 'done' error in console. Am I correct in thinking that I can't use this method?

Not on arrays, yes. You can call this method only on Promise and Deferred objects, like the one produced by $.when.apply(this, responseArray)

… but I can't seem to get the response that I need. Instead, what I get is [response, "success", response] where the first response is the correct return response for one of the AJAX calls and the last response is the actual call itself.

As stated in the docs for $.when, it resolves the result promise with multiple arguments - and when the input promises themselves did yield multiple values (such as $.ajax does), each argument is an arguments object of the respective promise resolution. You were only getting the first of them with response, but there are responseArray.length (letsSayTwo) arguments to the callback.

How should I go about getting the correct responses from both AJAX calls?

You want to extract the first item (response data) from each arguments object, so you can use map:

$.when.apply(this, responseArray).done(function() {
  var responses = $.map(arguments, function(args) { return args[0]; }),
      spit = someAnalysis(responses);
  console.log(spit);
}).fail(function(jqXHR, textStatus, errorThrown) {
  console.log('fail: '+textStatus);
});

edited Sep 10, 2015 at 15:06

answered Sep 30, 2013 at 9:22

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Michael Choi Over a year ago

Got it! Thanks for explaining it so well. Just one note, I think the last character on the second line should be a semicolon, not a comma.

Bergi Over a year ago

No, it should: That makes it a multi var statement, declaring spit as well.

Michael Choi Over a year ago

Haha of course. Sorry, I took out the someAnalysis line and it threw an error. Thanks!

Collectives™ on Stack Overflow

AJAX Promises using Array

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related