5

I'm making multiple API calls, after which I want to load the combined results of each call:

$.when(
    $.get(localAPI, data, function(response) {
        globalStore.localShares = Number(response);
    }),

    $.get(facebookAPI, '', function(response){
        globalStore.facebookShares = Number(response[0].share_count);
    }),

    $.getJSON(pinterestAPI, {url: url}).done(function(response){
        globalStore.pinterestShares = Number(response.count);
    })
).always(function(){
   //Do stuff
});

If the $.get calls fail, the $.always callback function still executes.

But

If just one $.get call fails, it negates the actions of the previous calls.

So, if the first call fails, globalStore returns with two items. If the first call succeeds but the second fails, globalStore returns with only one item. And if the first two calls succeed but the last one fails, globalStore returns empty.

Is there any way around this?

Edit:

Yes, I have tried to handle fails within $.when like this:

$.when(
    $.get(mu30_ajax_frontend.ajaxurl, data, function(response) {
        globalStore.localShares = Number(response);
    }).fail(function(){
        globalStore.localShares = 0;
    }),

    $.get(facebookAPI, '', function(response){
        globalStore.facebookShares = Number(response[0].share_count);
    }).fail(function(){
        globalStore.facebookShares = 0;
    }),

    $.getJSON(pinterestAPI, {url: url}).done(function(response){
        globalStore.pinterestShares = Number(response.count);
    }).fail(function(){
        globalStore.pinterestShares = 0;
    })
).always(function(){
   //Do stuff
});

But I get the same result.

3
  • Have you tried handling the failures? $.get().fail(function(err){}) Feb 10, 2016 at 19:52
  • Yes, I just tried that. I added the code above. Still get the same exact issue.
    – ibhhvc
    Feb 10, 2016 at 19:57
  • This sounds like a duplicate of $.Deferred: How to detect when every promise has been executed, but I'm not sure what exact behaviour you do expect from your "way around".
    – Bergi
    Feb 17, 2016 at 2:31

3 Answers 3

5

There's no way around this when using $.when that way, if one request fails, the entire chain fails.

You'd have to roll your own instead, using deferreds to know when the calls are all completed, and always successfully resolving etc.

var defs = [new $.Deferred(), new $.Deferred(), new $.Deferred()];

$.get(localAPI, data, function(response) {
    globalStore.localShares = Number(response);
    defs[0].resolve(true);
}).fail(defs[0].resolve);

$.get(facebookAPI, '', function(response){
    globalStore.facebookShares = Number(response[0].share_count);
    defs[1].resolve(true);
}).fail(defs[1].resolve);

$.getJSON(pinterestAPI, {url: url}).done(function(response){
    globalStore.pinterestShares = Number(response.count);
    defs[2].resolve(true);
}).fail(defs[2].resolve);

$.when.apply($, defs).then(function(result) {
    // result is an array, any true value is a successful request "[true, true, true]"
});

written verbosely, this could be prettied up with some functions and loops etc.

2
  • per my previous comment... answer is because jquery.
    – Kevin B
    Feb 10, 2016 at 20:51
  • 1
    You should avoid the deferred antipattern! Even in jQuery, which does not have catch, you can do .then(null, function(err) { return $.Deferred().resolve("don't care"); })
    – Bergi
    Feb 17, 2016 at 2:33
0

I think the solution I needed was actually a simple one. I didn't care about success or failure, I just wanted to know when ajax was done. So:

$.get(mu30_ajax_frontend.ajaxurl, data, function(response) {
    globalStore.localShares = Number(response);
});

$.get(facebookAPI, '', function(response){
    globalStore.facebookShares = Number(response[0].share_count);
});

$.getJSON(pinterestAPI, {url: url}).done(function(response){
    globalStore.pinterestShares = Number(response.count);
});

$(document).ajaxStop(function(){
   //Do stuff
});
0

From the jQuery $.when() docs (emphasis mine):

In the case where multiple Deferred objects are passed to jQuery.when(), the method returns the Promise from a new "master" Deferred object that tracks the aggregate state of all the Deferreds it has been passed. The method will resolve its master Deferred as soon as all the Deferreds resolve, or reject the master Deferred as soon as one of the Deferreds is rejected.

So, yes jQuery.when will immediately fail if one of the passed promises is rejected/fails.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.