Since jQuery 1.8 .then behaves the same as .pipe: Deprecation Notice: As of jQuery 1.8, the deferred.pipe() method is deprecated. The deferred.then() method, which replaces it, should be used instead. and As of jQuery 1.8, the deferred.then() method returns a new promise that can filter the status and values of a deferred through a function, … Read more
success only fires if the AJAX call is successful, i.e. ultimately returns a HTTP 200 status. error fires if it fails and complete when the request finishes, regardless of success. In jQuery 1.8 on the jqXHR object (returned by $.ajax) success was replaced with done, error with fail and complete with always. However you should … Read more
There’s a much better way to do this than using synchronous ajax calls. Jquery ajax returns a deferred so you can just use pipe chaining to make sure that each ajax call finishes before the next runs. Here’s a working example with a more in depth example you can play with on jsfiddle. // How … Read more
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 … Read more
More sophisticated promise libraries have an allSettled() function like Q or Promise.settle like Bluebird. In jQuery, you could implement such a function yourself as well and extend the $ namespace with it, but that will only be necessary if you need it often and performance-optimized. A simpler solution would be to create a new promise … Read more
There are two ways to handle this, and which you choose depends on which component should own the data and the loading state. Move the Ajax request into the parent and conditionally render the component: var Parent = React.createClass({ getInitialState: function() { return { data: null }; }, componentDidMount: function() { $.get(‘http://foobar.io/api/v1/listings/categories/’).done(function(data) { this.setState({data: data}); … Read more
The best use case I can think of is in caching AJAX responses. Here’s a modified example from Rebecca Murphey’s intro post on the topic: var cache = {}; function getData( val ){ // return either the cached value or jqXHR object wrapped Promise return $.when( cache[ val ] || $.ajax(‘/foo/’, { data: { value: … Read more
You can use .when(), and .apply() with multiple deferred. Extremely useful: function updateAllNotes() { var getarray = [], i, len; for (i = 0, len = data.length; i < len; i += 1) { getarray.push(getNote(data[i].key)); }; $.when.apply($, getarray).done(function() { // do things that need to wait until ALL gets are done }); }
You’re looking for $.when.apply($, promises).then(function(schemas) { console.log(“DONE”, this, schemas); }, function(e) { console.log(“My ajax failed”); }); This will also work (for some value of work, it won’t fix broken ajax): $.when.apply($, promises).done(function() { … }).fail(function() { … });` You’ll want to pass $ instead of null so that this inside $.when refers to jQuery. It … Read more
Update: jQuery 3.0 has fixed the problems outlined below. It is truly Promises/A+ compliant. Yes, jQuery promises have serious and inherent problems. That said, since the article was written jQuery made significant efforts to be more Promises/Aplus complaint and they now have a .then method that chains. So even in jQuery returnsPromise().then(a).then(b) for promise returning … Read more