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