Question

i’m confused. In case of this code:

function prepareit(list){
    for(i=0;i<list.length;i++){
         var test = list[i];
         $.ajax({....});
    }
}

function testit(list){
    for(i=0;i<list.length;i++){
         var test = list[i];
         $.ajax({....});
    }
}

$(document).ready(function() {
    var list = ['ti','meti','medes','fra','u','w','ro','sit','hd','i'];
    prepareit(list);
    testit(list);
});

I need to execute function “testit” when “prepareit” has complete. I’ve already tried with “when-then” method but functions start at same time.

(sorry for my bad english)

Answer 1

Create a deferred object that resolves when all of the ajax requests are done.

function prepareit(list){
    var defArr = [];
    for(i=0;i<list.length;i++){
         var test = list[i];
         defArr.push($.ajax({....}));
    }
    return $.when.apply($,defArr);
}

function testit(list){
    var defArr = [];
    for(i=0;i<list.length;i++){
         var test = list[i];
          defArr.push($.ajax({....}));
    }
    return $.when.apply($,defArr);
}

$(document).ready(function() {
    var list = ['ti','meti','medes','fra','u','w','ro','sit','hd','i'];
    prepareit(list).done(function(){
        testit(list).done(function(){
            alert("All done!");
        });
    });
});