客户端动态控件的jQuery验证

Question

我有通过javascript动态添加的控件。我无法将这些控件上的类设置为“required”，因为我需要灵活地将错误消息放在我想要的位置。 当我添加这些控件时，我遍历我需要的所有内容，然后调用

$("#dynamicControlID").rules("add", {required:true});

当我尝试验证表单时出现问题。当我打电话

$("#form1").validate()

任何指定了“required”类的非动态控件将使用一条好消息验证“此字段是必需的。”动态添加的控件不显示任何消息，并且validate函数返回true即使他们是空的。 当我单独验证动态控件时，会出现真正的混乱。如果我打电话

$("#dynamicControlID").valid()

它将返回false，并通过输入显示错误消息。我打电话

$("#form1").valid()

在我对动态控件做任何事情之前。

我在这里遗漏了什么吗？我想要的是致电

$("#form1").valid() 

并显示所有动态添加的控件的错误消息。

Answer 1

您处于正确的轨道上，但是当您想要为新元素添加规则时，您必须已经调用了$('#form1').validate();。

所以常见的设置是这样的：

$('#form1').validate({
   //your options
});

$('#dynamicControlID').rules('add',{required:true});

Answer 2

您是否尝试在将控件添加到表单后创建验证规则？

您可以在页面加载时设置验证并存储在变量中，并像这样动态添加规则：

var validator = $("#form1").validate(rules:{});

添加动态控件后形成..

validator.settings.rules.new_control_name = { required: true };

然后在表单提交上：

if($("#form1").valid()){
    // valid
}