2016-06-29 36 views
1

我在爭取讓jQuery延遲爲我工作。jQuery推遲提早解析

我試圖連接一些函數調用,使$.ajax調用與jQuery .then語句,使用下面列出的模式,但每個函數都返回(然後繼續下去,然後繼續)解決ajax調用之前。

// earlier code runs fine to here 
}) 
.then(function (r) { 
    getCurrentYearAbsenceRequestData(); // calls function which contains a $.ajax request 
}) 
.then(function (r) { 
    restructureCurrentYearAbsenceData(); 
}); 

// further processing of results 

上面調用的函數遵循此模式:

function getCurrentYearAbsenceRequestData() { 
var dfd = $.Deferred(); 

    var today = moment(); 
    var startOfCurrentHolidayYear = moment($clnt.holidayYearStartDate, "DD MMMM").format("DD/MM/YYYY"); 
    var startDayOfCurrentHolidayYear = moment().dayOfYear(startOfCurrentHolidayYear) 
    var currentDayOfYear = moment().dayOfYear(); 

    if (moment(today).isBefore(startOfCurrentHolidayYear)) { //checks if holiday year started last year 
     startOfCurrentHolidayYear = moment(startOfCurrentHolidayYear).subtract(1, "years"); //if so subtract 1 year from start of currently holiday year date 
    }; 

    console.log("Start of Holiday year is " + startOfCurrentHolidayYear); 

    var getOrgDataQuery = $apiUrl + "/web/lists/getbytitle('AbsenceRequests')/Items?$select=Id,AssocBranch/Title,DateFrom,DateTo,EmployeeLookup/EmployeeName,EmployeeLookup/Id,AbsenceType/AbsenceTypeShort,ReviewOutcome,TotalDays,AbsenceNotes&$expand=AssocBranch/Title,EmployeeLookup/EmployeeName,AbsenceType/AbsenceTypeShort&$filter=DateFrom ge '" + startOfCurrentHolidayYear + "'"; 

     $.ajax(_cnxRest.getRequest(getOrgDataQuery)) //calls personal library function which formats the parameter - this works OK) 
      .done(function (r) { 
       console.log("Get Org data success" + r); 
       var $absDataCurrentYearData = r.d.results; 
       $absData.allCurrentYear = $absDataCurrentYearData; 

      dfd.resolve(); 
      }) 
     .fail(function (err) { 
      logError(err); 
     }); 
    }; 

    return dfd.promise(); 

}; 

我想在$就呼籲解決後續的功能。那麼之前的進展,並會樂意接受一些明智的建議在何處我錯了。

回答

1

異步函數必須按順序返回一個承諾通知異步的調用者。否則,調用者的鏈將繼續,而不考慮異步,這是問題中描述的症狀。

你只是缺少一些回報,儘管代碼也有所整理。

// earlier code runs fine to here 
.then(function (r) { 
    return getCurrentYearAbsenceRequestData(); 
// ^^^^^^ 
}) 
.then(function (r) { 
    return restructureCurrentYearAbsenceData(); 
// ^^^^^^ 
}) 
.fail(function (err) { 
    logError(err); // by logging here you will see reported errors arising from the entire chain. 
}); 

function getCurrentYearAbsenceRequestData() { 
    var startOfCurrentHolidayYear = moment($clnt.holidayYearStartDate, "DD MMMM").format("DD/MM/YYYY"); 
    if(moment(moment()).isBefore(startOfCurrentHolidayYear)) { 
     startOfCurrentHolidayYear = moment(startOfCurrentHolidayYear).subtract(1, "years"); 
    }; 
    var getOrgDataQuery = $apiUrl + "/web/lists/getbytitle('AbsenceRequests')/Items?$select=Id,AssocBranch/Title,DateFrom,DateTo,EmployeeLookup/EmployeeName,EmployeeLookup/Id,AbsenceType/AbsenceTypeShort,ReviewOutcome,TotalDays,AbsenceNotes&$expand=AssocBranch/Title,EmployeeLookup/EmployeeName,AbsenceType/AbsenceTypeShort&$filter=DateFrom ge '" + startOfCurrentHolidayYear + "'"; 
    return $.ajax(_cnxRest.getRequest(getOrgDataQuery)) 
// ^^^^^^ 
    .then(function(r) { 
     $absData.allCurrentYear = r.d.results; 
     retrun r; // make the result available to the next step in the caller's .then chain, even if it's not going to be used 
//  ^^^^^^ 
    }); 
}; 

主鏈可以被簡化爲:

.then(getCurrentYearAbsenceRequestData) // calls function which contains a $.ajax request 
.then(restructureCurrentYearAbsenceData) 
.fail(function(err) { 
    logError(err); 
}); 

這裏,retruns是那些指定的功能內寫入。