Question

我在.NET MVC中有一个可以通过多个按钮提交的表单。每个按钮将eventCommand隐藏字段设置为特定值，然后提交表单，如下所示：

$(document).ready(function(){
    $("[data-crm-action]").on("click", function (e) {
        e.preventDefault();
        $("#EventCommand").val($(this).data("crm-action"));
        $("form").submit();
    });
});

但是，我需要在按钮上单击两次才能看到提交的表单。为什么第一次点击时没有提交？在第一次单击时，光标将被发送回搜索字段的文本框。电子邮件字段在带有注释的模型中被标记为必需，但我尝试将formnovalidate添加到我的按钮，它仍然可以。

以下是视图中的一些代码：

@using (Html.BeginForm())
{
@Html.HiddenFor(m => m.EventCommand)
@Html.HiddenFor(m => m.IsValid)
@Html.HiddenFor(m => m.Mode)

<!-- BEGIN SEARCH AREA -->
if (Model.IsSearchAreaVisible)
{
    <div class="panel panel-primary">
        <div class="panel-heading">
            <h1 class="panel-title">Search for Users</h1>
        </div>
        <div class="panel-body">
            <div class="form-group">
                @Html.LabelFor(m => m.SearchEntity.Email):
                @Html.TextBoxFor(m => m.SearchEntity.Email, new { @class = "form-control" })
            </div>
        </div>
        <div class="panel-footer">
            <button id="btnSearch" class="btn btn-sm btn-primary" data-crm-action="search">
                <i class="glyphicon glyphicon-search"></i>&nbsp;Search
            </button>
            <button id="btnReset" class="btn btn-sm btn-primary" data-crm-action="resetsearch">
                <i class="glyphicon glyphicon-share-alt"></i>&nbsp;Reset
            </button>
            <button id="btnAdd" class="btn btn-sm btn-success" data-crm-action="add">
                <i class="glyphicon glyphicon-plus"></i>&nbsp;Add
            </button>
        </div>
    </div>
}
<!-- END SEARCH AREA -->

<!-- BEGIN DETAIL AREA -->
if (Model.IsDetailAreaVisible)
{
    <div class="panel panel-primary">
        <div class="panel-heading">
            <h1 class="panel-title">User Information</h1>
        </div>
        <div class="panel-body">
            <!-- BEGIN MESSAGE AREA -->
            <div class="row">
                <div class="col-sm-12">
                    @if (!Model.IsValid)
                    {
                        <div class="alert alert-danger alert-dismissable" role="alert">
                            <button type="button" class="close" data-dissmiss="alert">
                                <span aria-hidden="true">
                                    &times;
                                </span>
                                <span class="sr-only">Close</span>
                            </button>
                            @Html.ValidationSummary(false)
                        </div>
                    }
                </div>
            </div>
            <!-- END MESSAGE AREA -->
            <div class="form-group">
                @Html.LabelFor(m => m.Entity.FirstName)
                @Html.TextBoxFor(m => m.Entity.FirstName, new { @class = "form-control" })
                @Html.LabelFor(m => m.Entity.LastName)
                @Html.TextBoxFor(m => m.Entity.LastName, new { @class = "form-control" })
                @Html.LabelFor(m => m.Entity.Title)
                @Html.TextBoxFor(m => m.Entity.Title, new { @class = "form-control" })
                @Html.LabelFor(m => m.Entity.Email)
                @Html.TextBoxFor(m => m.Entity.Email, new { @class = "form-control" })
                @Html.LabelFor(m => m.Entity.Phone)
                @Html.TextBoxFor(m => m.Entity.Phone, new { @class = "form-control" })
                @Html.LabelFor(m => m.Entity.PhoneExtension)
                @Html.TextBoxFor(m => m.Entity.PhoneExtension, new { @class = "form-control" })
                @Html.LabelFor(m => m.Entity.IsActive)
                @Html.EditorFor(m => m.Entity.IsActive)
                @Html.LabelFor(m => m.Entity.AccessLevelID)
                @Html.TextBoxFor(m => m.Entity.AccessLevelID, new { @class = "form-control" })
            </div>
        </div>
        <div class="panel-footer">
            <button id="btnSave" class="btn btn-sm btn-primary" data-crm-action="save" formnovalidate="formnovalidate">
                <i class="glyphicon glyphicon-floppy-disk"></i>&nbsp;Save
            </button>
            <button id="btnCancelAdd" class="btn btn-sm btn-primary" data-crm-action="cancelAdd" formnovalidate="formnovalidate">
                <i class="glyphicon glyphicon-remove-sign"></i>&nbsp;Cancel
            </button>
        </div>
    </div>
}

Answer 1

我使用相同的请求管理模式并且有两个验证摘要字段（一个在模态窗口内，虽然我不明白为什么没有显示相同的奇怪行为，但是在模态窗口中工作完全）我需要在提交之前禁止验证。

我尝试过设置，

formnovalidate="formnovalidate"

按钮的

标签我希望抑制验证，这只会产生这里提到的令人讨厌的副作用。

对我来说有用的是，在js方面将e.preventdefault设置为我想要验证的请求的选项，如下所示：

command = $(this).data("gtb-action");
if (command === "PostNoteEntity") {
    e.preventDefault();
}

请尝试！

Jquery表单只提交一次点击

1 个答案: