AJAX call in array loop, call next only after previous complete

Question

I have an array to upload data and I want them to send to server one by one. I want the previous one to complete before I send next one. Actually, after each response I want to decide whether to send next one or not.

while (packetCount < bulkUploadPackets.length) {
  d = d.then(save(bulkUploadPackets[packetCount]))
    .then(function(uploadResponse) {
      //I want to come here after first call complete 
      //before second call is fired and so on
      packetCount++;
    });
}


save: function(modelToSave) {
  var defer = $.Deferred();
  var self = this;
  this.model = modelToSave;
  Backbone.sync('create', this, {
    success: function(data, textStatus, jqXHR) {
      console.log("success" + data);
      defer.resolve(data);
    },
    error: function(response) {
      defer.reject(errorObj);
    }
  });

  return defer.promise();
}

AJAX is asynchronous, and you should use it asynchronously. If you want to maintain some processing order, you shouldn't fight with AJAX to do so, but rather implement that logic server-side and send the whole array in one request... — MarioDS
– MarioDS, Commented Apr 14, 2016 at 14:58

jcubic · Accepted Answer · 2016-04-14 14:57:48Z

1

You can use recursive function and put recursive call inside then:

(function loop() {
     if (packetCount<bulkUploadPackets.length) {
           d = d.then(save(bulkUploadPackets[packetCount]))
                .then(function(uploadResponse){
                      //I want to come here after first call complete before second call is fired and so on
                      packetCount++;
                      loop();
                 }); 
     }
})();

answered Apr 14, 2016 at 14:57

jcubic

67.1k58 gold badges252 silver badges466 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ahmad Over a year ago

but how would it ensure, it fires next before completing previous one

jcubic Over a year ago

It will execute the function when promise is resolved. second call to loop will always be executed when first promise is resolved.

Collectives™ on Stack Overflow

AJAX call in array loop, call next only after previous complete

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related