Possible Duplicate:
Wait until all jquery ajax request are done?
Multiple ajax calls inside a each() function.. then do something once ALL of them are finished?
The function below runs all this code at document ready but I am trying to run other functions when all the data from these completes.
function loadZonesDistrictsStoresData(){
        $.getJSON('/CampaignMgmt/GetZonesByClient', { 'clientid': clientid }, function (zones){
            $.each(zones, function(index, zoneid){
                var li_tag = '<li id="'+ zoneid +'"> <label><input id="'+zoneid+'" data-id="'+zoneid+'" onchange="zones.selectZone(this.value)" type="checkbox" name="zone_'+zoneid+'" value="'+ zoneid +'"><span>' + zoneid +'</span> </label></li>';
                $("ul.zones").append(li_tag);
                $.getJSON('/CampaignMgmt/GetDistrictsByZone', {'clientid': clientid, 'zone': zoneid }, function(data){
                    zone_object[zoneid] = data;
                    $.each(data, function(index, districtid){
                        $.getJSON('/CampaignMgmt/GetStoresByDistrict', {'clientid': clientid, 'district': districtid }, function(stores){
                            districts_object[districtid] = stores;
                        });
                    });
                });
            });
        });
    }
 
    