[jquery][asp.net mvc]defer延遲執行與ajax搭配的方式(如何等取得ajax執行完畢回傳的value之後,才執行後續動作)
Controller(C#):設定ajax會取得的資料,由db取出
[HttpPost]
public ActionResult AjaxGetMyData(MyModel model)
{
if (model == null)
{
return Json(new EmptyResult());
}
var results = (from o in db.myTable
select new OrgModel
{
OrgId = o.OrgId,
OrgName = o.OrgName,
EmpName = o.EmpName,
}).ToList();
return Json(results);
}
javascript:執行jquery的ajax call,並根據回傳的value,再去跑後續的javascript
下面範例是畫面上按下查詢按鈕之後,會先開始執行exeTestAjax(),然後就開始跑一連串的流程喔
特別注意的地方是:done()是可以重複多次呼叫,所以ajax執行之後若是有多行javascript要run的話,可以套用多個done()喔
//
function AjaxGetMyData(OrgId) {
//var appPath = '@Url.Content("~/")';
return $.ajax({
type: 'POST',
url: appPath + 'MyController/AjaxGetMyData/',
data: { OrgId: OrgId },//這是以model的方式傳值
success: function (resultData) {
},
error: function (error) {
console.log(error);
alert('出現意料之外的錯誤,請查看F12的console.log()紀錄。');
},
});
}
function exeTestAjax() {
AjaxGetMyData('passMyValue').done(function (resultData) {
$.each(resultData, function (index, org) {
console.log(resultData.columnData);
});
}).done(function () {
console.log('Finally I finished loop!');
});
}
多個done()的使用方式除了上面的
done().done().done()….
這個方式通常是第一個done是ajax call,後續兩個done是一般的javascript指令
也可以變成如下的方式使用:
done(done(done()))
這是巢狀的ajax呼叫,適用於多個ajax call,且每一個ajax都要接著使用上一個ajax的回傳value的情況
參考資料:
https://www.gss.com.tw/blog/jquery%E9%80%9A%E9%81%8Edeferred%E7%89%A9%E4%BB%B6%E7%AE%A1%E7%90%86ajax%E9%9D%9E%E5%90%8C%E6%AD%A5
https://api.jquery.com/jquery.deferred/