I’m starting to put together an example of using .queue()
, jQuery.Deferred()
, jQuery.ajax()
together to create a queue for ajax requests.
It is a front-end for jQuery.ajax()
and takes the same options/arguments as any standard ajax call, just makes sure that only one ajax call can be running at a time.
Take a look at the gist.
/** jQuery.ajaxQueue - A queue for ajax requests* * (c) 2011 Corey Frang* Dual licensed under the MIT and GPL licenses.** Requires jQuery 1.5+*/ (function($) {
// jQuery on an empty object, we are going to use this as our Queuevar ajaxQueue = $({});
$.ajaxQueue = function( ajaxOpts ) { var jqXHR, dfd = $.Deferred(), promise = dfd.promise();
// queue our ajax request ajaxQueue.queue( doRequest );
// add the abort method promise.abort = function( statusText ) {
// proxy abort to the jqXHR if it is active if ( jqXHR ) { return jqXHR.abort( statusText ); }
// if there wasn't already a jqXHR we need to remove from queue var queue = ajaxQueue.queue(), index = $.inArray( doRequest, queue );
if ( index > -1 ) { queue.splice( index, 1 ); }
// and then reject the deferred dfd.rejectWith( ajaxOpts.context || ajaxOpts, [ promise, statusText, "" ] ); return promise; };
// run the actual query function doRequest( next ) { jqXHR = $.ajax( ajaxOpts ) .done( dfd.resolve ) .fail( dfd.reject ) .then( next, next ); }
return promise;};
})(jQuery);
/* * jQuery.ajaxQueue - A queue for ajax requests * * (c) 2011 Corey Frang * Dual licensed under the MIT and GPL licenses. * * Requires jQuery 1.5+ */(function(a){var b=a({});a.ajaxQueue=function(c){function g(b){d=a.ajax(c).done(e.resolve).fail(e.reject).then(b,b)}var d,e=a.Deferred(),f=e.promise();b.queue(g),f.abort=function(h){if(d)return d.abort(h);var i=b.queue(),j=a.inArray(g,i);j>-1&&i.splice(j,1),e.rejectWith(c.context||c,[f,h,""]);return f};return f}})(jQuery)