使用 jquery validate 进行通用选择答案

【问题标题】：Generic selection using jquery validate使用 jquery validate 进行通用选择
【发布时间】：2012-06-14 01:56:29
【问题描述】：

作为一个相对的 jquery 新手，如果我的问题有一个简单的解决方案，请多多包涵。当通过unique ID 选择时，使用 jquery validate 效果很好。

$("#myForm").validate({
    debug: false,
    rules:
    {
         field1: "Required"
    },
    messages:
    {
         field1: "Required"
    },
    submitHandler: function(form) {
         $.post('formAction.php', $("#myForm").serialize(), function(data) {
            $('#results').html(data);
         });
    }
});

我需要扩展它以通用地处理一些自动生成的表单myForm1, myForm2 等。

我可以通过通用类选择器$("myForm") 进行验证，然后将submitHander 应用于特定表单（myForm1、myForm2 等），例如：

$(".myForm").validate({
    debug: false,
    rules:
    {
         field1: "Required"
    },
    messages:
    {
         field2: "Required"
    },
    submitHandler: function(form) {
         $.post('formAction.php', $(this).serialize(), function(data) {
            $('#results').html(data);
         });
    }
});

非常感谢

【问题讨论】：

标签： jquery jquery-selectors jquery-validate

【解决方案1】：

试试这个

$('[id^=myForm]').validate(); // work for id pattern myForm1, myForm2...
                              // this selector will target forms whose id start
                              // with myForm

或

$('.myForm').validate() // giving a common class to all forms

像这样自动完成调用submitHandler

 validator.settings.submitHandler.call( validator, validator.currentForm );

这意味着this 将引用validator object 而不是form，所以使用form 参数来引用表单并像这样序列化它的字段

 $(form).serialize()

因此，在您提交处理程序而不是 $(this).serialize() 使用 $(form).serialize()。

【讨论】：

谢谢，我应该更详细一点。我已经尝试过通用调用选择器 $('.myForm') 和使用通配符 $('[id^=myForm]')。这很好，但是我如何引用所选的单个表单。在上面的示例中，我用 $(this) m 说明了这一点，但该选择器无效。希望我解释得更好？

【解决方案2】：

e validate 方法不会链接对表单的引用，因此建议 $(form).serialize 仍然指的是共享公共类的第一个表单。巨大的帮助，因为它让我找到了解决方法：-

https://github.com/jzaefferer/jquery-validation/issues/157

$(".myForm").each(function(index,element) {
  $(element).validate({

    debug: false,

    rules:
    {
         field1: "Required"
    },
    messages:
    {
         field2: "Required"
    },
    submitHandler: function(form) {
         $.post('formAction.php', $(form).serialize(), function(data) {
            $('#results').html(data);
         });
    }
  });
 });

【讨论】：