jquery - 确认暂停表单提交，直到按下“确定”

Question

我有一个表单，弹出一个确认对话框(您想继续吗)，它现在弹出，但表单同时发送到我的 Controller ，无论您点击"is"还是“否”，它都会开始处理。如何暂停表单提交，直到显示/选择 JavaScript 确认之后。

 @using (Html.BeginForm("Process", "Home", FormMethod.Post, 
 new { id ="MyForm" })) {  
    @Html.TextBoxFor(m => m.Name); 
    // other form controls...
    <input id="Submit" type="submit" value="Apply Changes" /> 
 }

javascript:(使用 jquery-ui)

 $(function () {
        $("#Confirm").dialog({
            autoOpen: false,
            buttons: {
                "Ok": function() {
                    $(this).dialog("close");
                    $('#MyForm').submit();
                    return true;
                },
                Cancel: function() {
                    $(this).dialog("close");
                    event.preventDefault();
                    return false;
                }
            }
        });

        $("#Submit").click(function () {
            $("#Confirm").dialog("open");
        });
    });

Answer 1

立即阻止默认操作，然后按下“确定”按钮触发提交。

 $(function () {
    $("#Confirm").dialog({
        autoOpen: false,
        buttons: {
            "Ok": function() {
                $(this).dialog("close");
                $('#MyForm')[0].submit();
            },
            Cancel: function() {
                $(this).dialog("close");
            }
        }
    });

    $("#MyForm").submit(function (e) {
        e.preventDefault();
        $("#Confirm").dialog("open");
    });
});