Question

我正在为表单控件使用jquery验证插件。我可以轻松地使用三种不同的消息验证三个单独的控件，并对数字，最小长度，最大长度进行适当的验证。我有像Web引用，出生日期，邮政编码和其他字段，具有多个文本框的控件。下面是用于Web引用的html，

<input name="txtRef1" runat="server" type="text" id="txtRef1" />
<span class="ForwardSlash">-</span>
<input runat="server" name="txtRef2" type="text" id="txtRef2"  />
<span class="ForwardSlash">-</span>
<input runat="server" name="txtRef3" type="text" id="txtRef3"  />

我为此编写了一个自定义验证器方法，检查上述三个文本框中的任何一个是否为空，然后用户将收到一条消息 - “需要字段”。我不想拥有单独的消息，因为它打破了包括表单设计布局在内的设计。实现上述目标的脚本如下：

function setuppagevalidationrecall() {

    $.validator.addMethod('example',

      function (value, element) {

              return ((value != "") && ($('#txtRef2').val() != "") && ($('#txtRef3').val() != ""));

          }, "Field is required");


    var validator = $("#form1").validate({
        rules: {
            txtRef1: {
                example: true,
                number: true,
                minlength: 3,
                maxlength: 3
            }

        }
    });

如何改进此功能以检查数字，最小长度和最大长度，以便对于上面的所有三个文本框，我只获得一条消息验证消息。并且使示例方法与参数一样动态，以便它可以应用于任何字段，如邮政编码（2个文本框），出生日期（3个文本框，dd / mm / yyyy）

Answer 1

为多个控件显示单个验证消息是组的用途。

指定错误消息的分组。组由任意组名称作为键和空格组成分隔的元素名称列表作为值。使用errorPlacement 控制组消息的放置位置。

使用

groups:{ txtRef : "txtRef1 txtRef2 txtRef3" }

和

errorPlacement: function (error, element) {
                if (element.attr("name") == "txtRef1"
             || element.attr("name") == "txtRef2"
             || element.attr("name") == "txtRef3")
                    error.insertAfter("#txtRef3");
                else
                    error.insertAfter(element);
    },

在此尝试：

http://jsfiddle.net/uZYMr/2/

Answer 2

您可以通过正确使用来自invalidHandler的{{1}}和errorPlacement来处理您要执行的操作。无需创建jquery.validate来存储一个全局表单中许多元素的错误消息。

我知道function有时会因为同时发生的所有错误而烦人，但我相信这会对你有帮助。

看一下这个例子：

http://jsfiddle.net/Lrvxk/

正如您所看到的，没有自定义功能或棘手的事情可以让您的工作正常运行。

希望这会有所帮助： - ）

使用jquery验证插件显示多个控件的单个验证消息

2 个答案: