paocom paocom - 5 months ago 12
Javascript Question

How to use .promise().done() on $.each json array when done/completed?

I want to perform some action when $.each is done.



$.each(someArray, function(index, val) {

//---------some async ajax action here per loop ---------
$.ajax({...}).done(function(data){...});

}.promise().done(function(){...}); //<-------error here can't use with $.each



  • Not every jQuery function has a
    promise()
    ?

  • How do I know when $.each array is done?

  • Can I change someArray to $someArray to use it?


Answer

As you've figured out, $.each() doesn't have a .promise() so you can't do it the way you were trying to. Instead, you can use $.when() to track when a bunch of promises returned by a group of Ajax functions have all been resolved:

var promises = [];
$.each(someArray, function(index, val) {
    //---------some async ajax action here per loop ---------
    promises.push($.ajax({...}).then(function(data){...}));
});
$.when.apply($, promises).then(function() {
    // code here when all ajax calls are done
    // you could also process all the results here if you want
    // rather than processing them individually
});

Or, rather than your $.each(), it's a bit cleaner to use .map():

$.when.apply($, someArray.map(function(item) {
    return $.ajax({...}).then(function(data){...});
})).then(function() {
    // all ajax calls done now
});