Javascript MVC形态引导模式确认

我在这里遇到困难。我想创建一个全局Javascript函数，防止表单按钮提交，直到在模式上选择了一个选项，并且可以在系统中的任何地方使用。我有一个表格，这里是简化的：

@using (Html.BeginForm("UserCreate", "Administration", FormMethod.Post,
                      new { @Id = "user-form", @Style = "color:#595959;" }))
{
    <input name="submit"
           type="submit"
           class="button"
           id="removeAccount"
           value="Remove account" 
           formaction="@Url.Action("DeleteAccount", "Administration",
                         new { userAuthenticationId = Model.UserAuthentication.Id, 
                               userId = Model.UserId })" 
           formmethod="post"
           onclick="return confirmDialog('Are you sure you wish to remove this account?');"/>

    <input name="submit" type="submit" class="button" id="save" value="Create user"/>
}

以及模态html：

<!-- Modal -->
<div class="modal fade" id="confirmModal" tabindex="-1" role="dialog" aria-labelledby="confirmModalTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div id="confirmMessage" class="modal-body">
                
            </div>
            <div class="modal-footer">
                <button id="confirmOk" type="button" class="button">Ok</button>
                <button id="confirmCancel" type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
            </div>
        </div>
    </div>
</div>

&时代；
好啊
取消

问题在于表单是在确认javascript有机会运行之前提交的

一种解决方案是隐藏真正的提交，并向用户显示一个假提交。单击假提交时，显示模式。当模式被确认时，触发真正提交按钮的点击事件处理程序

要执行此操作，请将表单更改为此

@using (Html.BeginForm("UserCreate", "Administration", FormMethod.Post,
                      new { @Id = "user-form", @Style = "color:#595959;" }))
{
    <input name="submit" type="submit" class="button" id="removeAccount"
           value="Remove account"
           formaction="@Url.Action("DeleteAccount", "Administration",
                         new { userAuthenticationId = Model.UserAuthentication.Id,
                               userId = Model.UserId })"
           formmethod="post"
           style="display:none;"
            />

    <button type="button" 
            onclick="return confirmDialog(event,'Are you sure you wish to remove this account?');">
            Remove account
    </button>
    <input name="submit" type="submit" class="button" id="save" value="Create user" />
}

编辑 为了使此方法更加可重用，您可以将假提交更改为

<button type="button" 
              onclick="return confirmDialog(event,'#removeAccount','Are you sure you wish to remove this account?');">
       Remove account
</button>

---

这看起来是一个很好的解决方案！让我试着在我标记为答案之前实现。谢谢@cullimorer你能实施吗？有什么问题吗？抱歉，项目被搁置了，但我今天要重新开始。将尝试实施并回复您。

 function confirmDialog(event,message) {
    event.preventDefault();       

    var fClose = function () {
        modal.modal("hide");
        return false;
    };

    var onConfirm = function () {
        modal.modal("hide");
        $("#removeAccount").click();  //trigger the click event handler of the real submit
        return true;
    };

    var modal = $("#confirmModal");
    modal.modal("show");
    $("#confirmMessage").empty().append(message);
    $("#confirmOk").unbind().one('click', onConfirm);
    $("#confirmCancel").unbind().one("click", fClose);
}

<button type="button" 
              onclick="return confirmDialog(event,'#removeAccount','Are you sure you wish to remove this account?');">
       Remove account
</button>

function confirmDialog(event,submitToConfirm,message) {
    event.preventDefault();       

    var fClose = function () {
        modal.modal("hide");
        return false;
    };

    var onConfirm = function () {
        modal.modal("hide");
        $(submitToConfirm).click();
        return true;
    };

    var modal = $("#confirmModal");
    modal.modal("show");
    $("#confirmMessage").empty().append(message);
    $("#confirmOk").unbind().one('click', onConfirm);
    $("#confirmCancel").unbind().one("click", fClose);
}