Question

我有一个主屏幕，其中包含2个部分列表和一个详细信息部分。通过按钮，我打开一个模态对话框。在此模式对话框中，2个按钮用于保存，另一个用于取消。保存后，我调用一个函数刷新主屏幕上的列表并关闭对话框。问题有时候，列表会在保存结束前刷新。然后我想在刷新列表之前等待保存结束。你知道怎么做：

$("#dialog-confirm").dialog({
    open: function (event, ui) {
        $('#FirstName2').focus(); 
    },
    beforeClose: function (event, ui) { RefreshList(); },
    close: function (event, ui) {
        $('#FirstName2').val('');
        $('#LastName2').val('');
    },
    resizable: false,
    height: 240,
    width: 300,
    modal: true,
    autoOpen: false,
    buttons: {
        "Sauvegarder": function () {

            $.ajax({
                type: "POST",
                url: "/Customer/Save",
                data: {
                    id: jsIdEmpty,
                    languageId: $('#Language2').val(),
                    firstName: $('#FirstName2').val(),
                    lastName: $('#LastName2').val(),
                    isEnable: $('#IsEnable2').attr('checked')
                },
                success: function (html) {
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) { }
            })

            $(this).dialog("close");
        },
        "Annuler": function () {
            $(this).dialog("close");
        }
    }

});


function RefreshList() {

    $.ajax({
        type: "POST",
        url: "/Customer/List",
        data: {
    },
    success: function (html) {
        $("#LeftColumn").html(html);
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) { }
    });

}

Answer 1

将您对Refresh（）的调用移至AJAX调用的成功事件处理程序：

        $.ajax({
            type: "POST",
            url: "/Customer/Save",
            data: {
                id: jsIdEmpty,
                languageId: $('#Language2').val(),
                firstName: $('#FirstName2').val(),
                lastName: $('#LastName2').val(),
                isEnable: $('#IsEnable2').attr('checked')
            },
            success: function (html) {
                RefreshList(); 
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) { }
        })

我也会将对话框关闭（）。这使得当AJAX调用完全完成（并且成功）时，它将调用Refresh并关闭。

Answer 2

问题是对./ Customer / Save的.ajax调用是异步发生的。要使其同步，请添加以下选项：

async: false

Answer 3

async：false有时可能会挂起ui，最好的方式可能是dave建议的方式。将代码移动到成功函数，它确保完成ajax。

jQuery事件序列

3 个答案: