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

Question

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 1

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
});