如何添加自定义验证方法？

Question

我正在开发一个 ASP MVC3 项目，使用验证和不显眼的 jquery。我在页面上有几个区域需要为其创建自定义验证，并确保它不会破坏其他任何内容。目前我有几个部分，每个部分都有一个单选按钮对、一些文本框、一个按钮和一个表格。用户填写文本框，点击按钮，我有一个函数可以将文本框中的数据放入表格的新行中。我还有一个计数器，每次按下按钮都会前进一次。

验证需要遵循“如果单选按钮返回 true，则计数器需要 > 1。

我编写的这个函数似乎可以工作，但我认为我需要重新编写它，以便将其绑定到现有的验证中，因此需要添加一个方法或规则：

$(document).ready(function () {
    $("#nextBtn").click(function () {
         var rows = $("#ROTable tr").length;
          if ($("#RO_Yes").is("checked") && (rows < 3))
          {
             $(this).closest("div.historyCollection").css("backgroundcolor: #ff0000;");
          }
    });
});

我环顾四周，发现 JQUery 网站上有一个部分讨论了规则（从属值），似乎它可能适合。但是因为我对这些东西还很陌生，所以我想在我朝一个方向看太难之前对专家进行调查。感谢您的阅读。

编辑：我一直在玩，我想出了这个：

第二次编辑：正如 TallMaris 所指出的，ROCounter 选择器是错误的，因此现在已更正但仍然失败并出现相同的错误：

$(document).ready(function () {
    $("#ROCounter").rules("add", {
        required: ($("#RO-Yes").is(":checked")) && ($('#ROCounter') < 1),
        messages: {
            required: "Please enter further information"
        }
    });
});

但它破坏了所有验证并导致 jquery.validate.min.js 文件出错： " TypeError: 无法读取未定义的属性 'form'"。

ROCounter 是一个隐藏字段。如果错误消息附加到此隐藏字段，是否意味着该消息也将被隐藏，所以不显示？这是一些 HTML：

<div class="formQuestion">
        <div class="editor-field2">
            @Html.RadioButtonFor(m => m.HistoryModel.EverHadRestrainingOrder, true, new { @class = "commentBox", id="RO_Yes" })
                <label for="HistoryModel_ChildAbuseCurrent">Yes</label>
            @Html.RadioButtonFor(m => m.HistoryModel.EverHadRestrainingOrder, false, new { @class = "commentBox", id = "RO_No", @checked = "checked" })
                <label for="HistoryModel_ChildAbuseCurrent">No</label>
        </div>
        <div class="editor-label2">
            @Html.LabelFor(m => m.HistoryModel.EverHadRestrainingOrder)
        </div>

@*  Start Fieldset collection for Restraining Order   *@
   <div class="hidden">
     <fieldset class="historyCollection"> 
       <legend>Please provide the following information</legend>  
        <div class="formGroupHist">
            <div class="editor-label-Hist">
                @Html.Label("Date of Order")
            </div>
            <div class="editor-field-Hist">
                @Html.TextBox("OrderDate-RO", null, new { @class = "dp" })
            </div>
        </div>

        <div class="formGroupHist" style="width: 125px">
            <div class="editor-label-Hist">
                @Html.Label("State")
            </div>
            <div class="editor-field-Hist">
            @Html.DropDownList("State-RO", new SelectList(Model.State, "Value", "Text"), "Select", new { style = "width: 65px;" })
            </div>
        </div>

        <div class="formGroupHist">
            <div class="editor-label-Hist">
                @Html.Label("Name of Protected Party")
            </div>
            <div class="editor-field-Hist">
                @Html.TextBox("ProtectedParties")
            </div>
        </div>            

        <div class="formGroupHist">
            <div class="editor-label-Hist">
                @Html.Label("Explanation of Circumstances")
            </div>
            <div class="editor-field-Hist">
                @Html.TextArea("Comments-RO")
            </div>
        </div>
        <div class="button">
            <button type="button" id="ROButton" class="SKButton">Add Information</button>
        </div>

        <div>
            @Html.HiddenFor(m => m.ROCounter)
        </div>
        <table id="ROTable" class="data-table-page2">
            <tr>
                <th>Date of Order</th>
                <th>State</th>
                <th>Name(s) of Protected Parties</th>
                <th>Explanation of Circumstances</th>
            </tr>
            <tr class="ROTempRow">
                <td colspan=4>No Information Entered.</td>

            </tr>
        </table>
    </fieldset>
</div>

不过，我的主要问题是如何正确地将新的验证规则与现有的验证联系起来。我已经读过，不显眼的首先解析文档以寻找现有的验证，如果找到任何验证，它将不再进行。大部分表单都与“库存”验证相关联，因此我不能将其损坏。一旦我弄清楚了那部分，我可能会弄清楚它的实际规则编码。

谢谢。

Answer 1

正如 cmets 中所述，由于 MVC 的库存验证，“必需”规则已经到位。此外，显然 MVC3 没有用于最小值的库存验证器，但仅用于范围...... 我建议你将自己的方法添加到验证器对象中，并将这条规则添加到对象中，像这样（来自API doc）

$.validator.addMethod("min_counter", function (value, el) {
    return value > 1;
});

然后添加规则。注意上面的方法名是作为规则和消息对象的键重复的，这就是 validate() 方法知道运行什么方法来执行实际验证的方式。

$("#ROCounter").rules("add", {
    //this tells validator to evaluate only when the radio is checked. 
    //For example, if you put "true" here, the rule "min_counter" will be evaluated always.
    min_counter: $("#RO-Yes").is(":checked"), 
    messages: {
        min_counter: "Please enter further information"
    }
});

让我知道这是否适合你。