Esha Ch Esha Ch - 1 month ago 8
Ajax Question

Calling a function is JQuery after all ajax calls(number of ajax calls are dynamic) have received responses

HTML:-

Result

Javascript:-

$(document).ready(function(){
$("#result").html("function started here");
var requests = Array();
requests.push($.get('https://maps.googleapis.com/maps/api/geocode/json?address=1600+Amphitheatre+Parkway,+Mountain+View,+CA'));
requests.push($.get('https://maps.googleapis.com/maps/api/geocode/json?address=EGL, Bangalore'));
var defer = $.when.apply($, requests);
console.log(defer);
defer.done(function(){
$("#result").html("Completed");
    // This is executed only after every ajax request has been completed
    $.each(arguments, function(index, responseData){

// alert(index);
$("#result").html(responseData);
        // "responseData" will contain an array of response information for each specific request
    });

});
});


The above snippet works only when all ajax calls returns "success" response. Is there any way where i can know if all ajax calls gets response,may it be "success" / "failure" .

Answer

you can you ajaxStart,ajaxStop,ajaxError,ajaxSuccess.

 $(document).ajaxStart(function () {
            //when ajax start
        }).ajaxStop(function () {
           //when ajax stop
        }).ajaxError(function () {
            //when ajax error
        }).ajaxSuccess(function () {
        // when ajax success
    });

This will trigger for every ajax call.