Question

我有一个弹出确认对话框的表单（你想继续）现在它会弹出但是表单会同时发送到我的控制器，无论你是否按下它都会开始处理。如何在显示/选择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

立即阻止默认操作，然后按下ok按钮触发提交。

 $(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");
    });
});

Answer 2

将submit按钮移到表单之外，然后将其更改为常规<input type="button"/>。

您的模态“确定”功能会为您提交，因此您不需要表单中的提交按钮。

@using (Html.BeginForm("Process", "Home", FormMethod.Post, 
 new { id ="MyForm" })) {  
    @Html.TextBoxFor(m => m.Name); 
    // other form controls...

 }
<input id="Submit" type="button" value="Apply Changes" />

Answer 3

你也可以使用＆＃34; onsubmit＆＃34;表单事件本身，如果您希望实际提交数据，则返回true或false。

确认暂停表单提交，直到Ok已被推送

3 个答案: