asp.net-mvc - 在 MVC 5 中保持提交以进行模式对话框确认

Question

当在我的创建 View 上提交数据时，我尝试显示模式对话框。我需要模式来强制提交等待模式对话框上的用户确认。然后需要提交数据。下面是我使用 bootstrap 3.0 modal-dialog 创建 View 的代码:

<div class="form-group">
                @Html.LabelFor(model => model.Name, new { @class = "control-label col-md-2" })
                <div class="col-md-10">
                    @Html.EditorFor(model => model.Name)
                    @Html.ValidationMessageFor(model => model.Name)
                </div>
            </div>
<div class="col-md-offset-2 col-md-10">
                <input id="create" type="submit" value="Create" class="btn btn-default"/>
            </div>

</div>

<div id="modalBox" class="modal">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <a class="close" data-dismiss="modal">X</a>
            <h1>Confirmation</h1>
        </div>
        <div class="modal-body">
            <h6>Click YES to confirm</h6>
        </div>
        <div class="modal-footer">
            <button id="noPost" class="btn btn-default" name="postConfirm" value="false" data-dismiss="modal">No Thanks</button>
            <button id="yesPost" class="btn btn-primary" name="postConfirm" value="true" data-dismiss="modal">YES</button>
        </div>
    </div>
</div>

@section scripts{
<scripts>
$(function () {
    var modalBox = function (e) {
        e.preventDefault();
        $("#modalBox").modal({ show: true });
    };
    $("#create").click(modalBox);
});
<scripts>
}

这确实会中断提交功能并打开模式对话框，但我不知道在对话框中进行选择后如何将数据提交回 Controller 。我还尝试使用 jquery ui 模式对话框和下面的脚本:

<script>
$("#create").click(function (e) {
    e.preventDefault();
    $("#postModal").dialog("open");
});

$("#postModal").dialog({
    autoOpen: false,
    width: 400,
    resizable: false,
    modal: true,
    buttons: {
        "No Thanks": function (data) {
            $("#create").submit();
            $(this).dialog("close");
        },
        "YES": function () {
            $("#create").submit();
            $(this).dialog("close");
        }
    }
});
</script>

这确实会打开模式对话框，但我仍然无法让它将模型数据提交回 Controller 。任何帮助将不胜感激。

更新

通过检查生成的 html，我发现我的输入字段驻留在我没有放在那里的表单中。我怀疑这是因为我使用了 @Html.ValidationSummary(true) 或 MVC 中内置的东西。因此，不要使用:

$("#create").submit();

我用过:

$("form:first").submit();

在页面上提交第一个也是唯一一个表单，它成功了!

Answer 1

将创建按钮类型更改为 type=button，并使其仅打开模态视图。并在模态 div 持有者中创建 yespost 按钮以输入 Submit 。您也可以尝试将整个模态 div 持有者放入表单组 div 中。在这里，您在打开模态视图之前发布帖子。这是因为你的按钮有 2 个逻辑任务，将这些任务分开，这应该可以工作。