在表单MVC上禁用非侵入式验证

San*_*tos 5 jquery-validate unobtrusive-validation asp.net-mvc-4

我在页面中有两种形式。我希望第一种形式使用非干扰式验证(因为它是由MVC自动生成的),但是我手动编写的第二种形式则不要使用非干扰式验证。

这是一些代码:

@using (Html.BeginForm("Add", "Contacts", FormMethod.Post, new { id = "AddForm" }))
{
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Datos Contacto</legend>
        <div class="editor-label">
            @Html.LabelFor(model => model.Name)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Name)
            @Html.ValidationMessageFor(model => model.Name)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.ContactDepartmentID)
        </div>
        <div class="editor-field">
            @Html.DropDownListFor(model => model.ContactDepartmentID, (List<SelectListItem>)ViewBag.ContactDepartments)
            @Html.ValidationMessageFor(model => model.ContactDepartmentID)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Sex)
        </div>
        <div class="editor-field">
            @Html.DropDownListFor(model => model.Sex, (List<SelectListItem>)ViewBag.Sexs)
            @Html.ValidationMessageFor(model => model.Sex)
        </div>
    </fieldset>
    <br />
    @Html.HiddenFor(model => model.SerializedEmails, new { data_bind = "value: ko.toJSON($root.emails())" })
    @Html.HiddenFor(model => model.SerializedPhones, new { data_bind = "value: ko.toJSON($root.phones())" })
}
<form id="phoneForm" >
<fieldset>
    <legend>Teléfonos</legend>
    <table class="table">
        <tbody data-bind="foreach: phones">
            <tr>
                <th>
                    Celular?
                </th>
                <th>
                    Phone
                </th>
                <th>
                    Extension
                </th>
                <th>
                </th>
            </tr>
            <tr>
                <td>
                    <input type="checkbox" data-bind="checked: isMobile" />
                </td>
                <td>
                    <input class="phone" data-bind='value: phone'/>
                </td>
                <td>
                    <input type="text" class="extension" data-bind='value: phoneExtension, enable: !isMobile() ' />
                </td>
                <td>
                    <a href='#' data-bind='click: $root.removePhone'>Delete</a>
                </td>
            </tr>
        </tbody>
    </table>
    <a href='#' data-bind='click: $root.addPhone'>Agregar teléfono</a>
</fieldset>
</form>
<p>
    <button onclick="Submit();" type="button" class="btn btn-primary" data-bind='enable: phones().length > 0 || emails().length > 0'>
        Create</button>
</p>
Run Code Online (Sandbox Code Playgroud)

JS:

  function Submit()
        {      
          var valid = $('#AddForm').valid();     
          var valid2 =  $('#phoneForm').valid();     

        }

        jQuery.validator.addClassRules("phone", {
          required: true
        });
Run Code Online (Sandbox Code Playgroud)

附带说明:当我从页面中删除不显眼时,第二个表单将验证,但第一个不会验证,如果我使用不显眼,则第一个表单将验证,而第二个则不会。

我知道我可以在客户端进行整个验证,如果那是我唯一的方法。我正在考虑一种方法,使MVC上的自定义标签保持不干扰验证,并以某种方式告诉页面使用验证而不会在单一表单上干扰(在这种情况下,仅针对敲除添加的元素)。

谢谢!

小智 6

您可以通过此 Html Helper 属性从 razor 代码中禁用不显眼的验证:

HtmlHelper.ClientValidationEnabled = false;
Run Code Online (Sandbox Code Playgroud)

这样,您可以根据特定视图/部分视图中的此设置对不同表单进行不显眼的验证。