Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery.when - Callback for when ALL Deferreds are no longer 'unresolved' (either resolved or rejected)?

When 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 either

  1. resolve its master Deferred as soon as ALL the Deferreds resolve, or
  2. reject its master Deferred as soon as ONE of the Deferreds is rejected.

If the master Deferred is resolved (ie. ALL the Deferreds resolve), it is passed the resolved values of all the Deferreds that were passed to jQuery.when. For example, when the Deferreds are jQuery.ajax() requests, the arguments will be the jqXHR objects for the requests, in the order they were given in the argument list:

$.when( $.getJSON('foo'), $.getJSON('bar') ).done(function(foo, bar) {      // foo & bar are jqXHR objects for the requests  }); 

In the multiple Deferreds case where one of the Deferreds is rejected, jQuery.when IMMEDIATELY FIRES the fail callbacks for its master Deferred, even if some of the Deferreds may still be unresolved at that point:

$.when( $.getJSON('foo'), $.getJSON('bar') ).fail(function(req) {      // req is the jqXHR object for one of the failed requests  }); 

I need to fire a callback when all the Deferreds passed to jQuery.when are no longer 'unresolved' (ie. all are either 'resolved' or 'rejected'). I could send JSON objects with 200 OK codes (instead sending JSON with 404 Not Found error status codes) and determine success/error in the done() method, but I'd prefer keeping my API RESTful. How can I accomplish this?

like image 278
Alan Spacer Avatar asked Apr 28 '11 20:04

Alan Spacer


People also ask

What is Deferred() in jQuery?

Deferred() A factory function that returns a chainable utility object with methods to register multiple callbacks into callback queues, invoke callback queues, and relay the success or failure state of any synchronous or asynchronous function.

What is Deferred and Promise in jQuery?

version added: 1.5deferred.The deferred. promise() method allows an asynchronous function to prevent other code from interfering with the progress or status of its internal request.

What is Promise and Deferred in javascript?

A promise is a placeholder for a result which is initially unknown while a deferred represents the computation that results in the value.

What is Promise method in jQuery?

promise() method returns a dynamically generated Promise that is resolved once all actions of a certain type bound to the collection, queued or not, have ended. By default, type is "fx" , which means the returned Promise is resolved when all animations of the selected elements have completed.


1 Answers

I think the easiest way to do this is to keep a secondary Deferred object around for each AJAX request, and ensure that that one is always resolved:

var d1 = $.Deferred(); var d2 = $.Deferred();  var j1 = $.getJSON(...).complete(d1.resolve); var j2 = $.getJSON(...).complete(d2.resolve);  $.when(j1, j2).done(function() {      // only fires if j1 AND j2 are resolved });  $.when(d1, d2).done(function() {      // will fire when j1 AND j2 are both resolved OR rejected      // check j1.isResolved() and j2.isResolved() to find which failed }); 

This is making use of the additional AJAX .complete() method which jQuery adds to its promises for AJAX methods, which is called for both resolved and rejected promises.

NB: d1.resolve works as a callback in its own right, it doesn't need to be wrapped in a function() { ... } block.

like image 115
Alnitak Avatar answered Oct 01 '22 21:10

Alnitak