1

我正在开发一个 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>

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

谢谢你。

4

1 回答 1

2

如评论中所述,由于 MVC 的库存验证,“必需”规则已经到位。此外,显然 MVC3 没有用于最小值的股票验证器,但仅适用于 Range ...我建议您将自己的方法添加到验证器对象并将此规则添加到对象中,就像这样(来自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"
    }
});

让我知道这是否适合你。

于 2012-10-19T23:18:20.710 回答