Question

我在页面中有两个表单。我希望第一种形式使用不显眼的验证（因为它是由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>

JS：

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

        }

        jQuery.validator.addClassRules("phone", {
          required: true
        });

作为旁注：当我从页面中删除不显眼的第二个表格验证，但第一个表格没有，如果我使用不引人注目的第一个验证，但第二个不验证。

我知道我可以在客户端进行整个验证，如果这是我做的唯一方法。我正在考虑使用MVC上的自定义标签进行不引人注意的验证的方法，并以某种方式告诉页面在单个表单上使用验证而不是不引人注目，或者在这种情况下仅针对淘汰添加元素。

谢谢！

Answer 1

您可以通过此Html Helper属性在剃刀代码中禁用不显眼的验证：

HtmlHelper.ClientValidationEnabled = false;

通过这种方式，您可以根据特定视图/局部视图中的此设置对不同表单进行不显眼的验证。

Answer 2

您可以标记元素或查找第二个input的所有form并删除规则，此示例用于删除表单中某些控件的所有规则，此原因根据用户选择了一些选项，所需的值将是其他选项。出于这个原因，我存储规则以便以后恢复它。

///Remove rules
$("input.rO,textarea.rO").each(function () {
   try
   {
      var rule = $(this).rules();
      if (rule) {
         $(this).data("rule", rule);
         $(this).rules("remove");
     }
  }
  catch(err){}
 });
 ///Restore rules
 $("input.rO.om" + v + ",textarea.rO.om"+v).each(function () {
      try
      {
        var rule = $(this).data("rule");
        if (rule)
           $(this).rules("add", rule);
      }
      catch(err){}
    });

Answer 3

如果删除unobtrusive-validation，那么您只是单独使用jQuery Validate插件。

如果是这种情况，那么您必须遵循该插件的文档。 The .valid() method can only be used after the plugin is first initialized via the .validate() method。另请参阅：http://jqueryvalidation.org

但是，不需要在submit函数或处理程序中包装任何内容。如果插件已正确初始化，插件会自动捕获提交事件。

$(document).ready(function() {

    $('#myform').validate({
        // rules and options
    });

    jQuery.validator.addClassRules("phone", {
         required: true
    });

});

简单演示：http://jsfiddle.net/DW4qE/

在窗体MVC上禁用不显眼的验证

3 个答案: