时间戳

首页 > 解决方案 > 带有多个 ajax 调用的 Jquery 回调

jquery - 带有多个 ajax 调用的 Jquery 回调

问题描述

我有几个函数，我根据来自 ajax 调用的列表填充下拉列表：

function getMissions(defaultId) {
    $.getJSON("Defaults/GetMissions", function (result) {
        var dropDownToFill = $('#change-mission');
        fillUpdateDropDown(dropDownToFill, result);
    });
}
function getSectors(defaultId) {
    $.getJSON("Defaults/GetSectors", function (result) {
        var dropDownToFill = $('#change-sector');
        fillUpdateDropDown(dropDownToFill, result);
    });
}

现在，在填写下拉列表后，我想选择一个特定的项目，但要获得这个项目，我需要一个其他的 ajax，比如：

function getDefaultDetails(defaultId) {
   $.ajax({
        type: "GET",
        url: "/Defaults/GetDefault",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: { defaultId: defaultId },
        success: function (response) {
            //code here to select the items from the response
        },
    });
}

主要功能基本上是：

function main(defaultId){
    getMissions(defaultId);
    getSectors(defaultId);
    getDefaultDetails(defaultId);
}

问题是在完成之前达到了success回调（下拉菜单可能有很多项目）。getDefaultDetailsfillUpdateDropDown

我试图理解回调，但就我而言，我无法解决我的问题。我尝试过类似的东西：

 $.when(getMissions(defaultId), getSectors(defaultId)).done(getDefaultDetails(defaultId));

但没有成功。

如何执行？

谢谢。

标签： jqueryajaxcallback

解决方案

$.when()期望thenable对象（Promise、Deferred、Thenable）像$.getJSON().

您还必须将 in 调用包装getDefaultDetails()在.done()匿名函数中，否则您正在执行该函数并且仅将其返回值 ( undefined) 用于.done()

function getMissions(defaultId) {
    return $.getJSON("Defaults/GetMissions", function (result) {
        var dropDownToFill = $('#change-mission');
        fillUpdateDropDown(dropDownToFill, result);
    });
}

function getSectors(defaultId) {
    return $.getJSON("Defaults/GetSectors", function (result) {
        var dropDownToFill = $('#change-sector');
        fillUpdateDropDown(dropDownToFill, result);
    });
}

function getDefaultDetails() { /* ... */ }

$.when(getMissions(defaultId), getSectors(defaultId))
 .done(function() { getDefaultDetails(defaultId) });

推荐阅读