javascript - Sequencing ajax requests -

I sometimes think I have to repeat some collections and call an AJAX call for each element. I want to return each call before returning to the next column so that I do not blast requests from the server - which often leads to other issues and I do not want to set ASCG false and want to freeze the browser .

Usually it has to set any type of iterator reference, which I step on every success callback. I think a cleaner should be the simplest way?

Does anyone have a clever design pattern to work neatly about how to call AJAX for an item?

jQuery 1.5 +

I have developed a plugin that uses it is, .

  / * * jQuery.ajaxQueue - A queue for AJAX requests * * (C) 2011 Cory Frang * is licensed under the MIT and GPL license. * * Requires jQuery 1.5+ * / (function ($) {// jQuery on a blank object, we will call it our queue var Ajax code = $ ({}); $ .ajaxQueue = function (ajaxOpts) {var Jqxhr going to use, dfd = $. Wrong (), promise = dfd.promise (); // qi our AJAX request ajaxQueue.queue (doRequest); // Promises the exception method. Bort = Function (statusText) {// proxy abort for JqXHR if it is active (jqXHR) {return jqXHR.abort (statusText);} // If there was not already a jqXHR, then we would need to enter the queue queue = ajaxQueue.queue ( ), From index = $. InArray (doR Equest, queue; if (index> gt; -1) {queue.splice (index, 1);} and then reject with deferred dfd.reject (ajaxOpts.context || ajaxOpts, [promise, status text , "]); Return promise;}; // run the actual query function doRequest (next) {Jqxhr = $ .ajaxOpts} .done (dfd.resolve) .fail (dfd.reject) Then (next, next) ;} Return Promise;};}) (JQuery);  

jQuery 1.4

If you are using jQuery 1.4, then you will be asked for your AJAX requests To create your "queue", use the animation queue on empty objects. ES Components.

You can make it your own $ Ajax () can also factor in the replacement. This plugin uses the standard 'fx' queue for $ .jaxQueue () jQuery, which will initialize the first added element if the queue is not already running.

  (function ($) {// jQuery on an empty object, we use it as our queue var ajax queue = $ ({}); $ .ajaxQueue = function (ajaxOpts) Going to // // Get the original full function Var oldComplete = ajaxOpts.complete; // Q.jaxOpts a full callback to fire our AJAX request ajaxQueue.queue (function (next) {// queue to fire the next event) .complete = function () {// fire completely fire if it was there (old-time) old filled. Apli (this, logic); next Run the next query in the (); // line; // query $ .ajax (ajaxOpts);});}};) (jQuery);  

example usage

Therefore, we have a and in which some & lt; Li & gt; We accept the & lt; Ul id = "output" & gt;

  // We want to copy to get each item (using AJAX!) We want to copy $ ("# Item Li"). Each (function (idx) {// queue a ajax request $ .ajaxQueue ({url: '/ echo / html /', data: {html: "[" + Idx + "]" + $ (this) .html ( ), Type: 'POST', success: function (data) {// #output $ ("# output"). Attachments ($ ("(lt; Li & gt;", {html: data} ));}}};});  

-