使用具有jquery表单验证的组.怎么样？

Question

我一直在查看可用于jquery表单验证插件的选项列表(http://docs.jquery.com/Plugins/Validation/validate#toptions).我想要了解选项组的工作原理.官方(？)网站上唯一可用的代码是:

// Use a table layout for the form, placing error messages in the next cell after the input.
$("#myform").validate({
  groups: {
    username: "fname lname"
  },
  errorPlacement: function(error, element) {
     if (element.attr("name") == "fname" 
                 || element.attr("name") == "lname" )
       error.insertAfter("#lastname");
     else
       error.insertAfter(element);
   },
   debug:true
 })

我知道他们正在创建一个名为"用户名"的组,它将表单中的两个元素组合在一起:"fname"和"lname",但该组是如何使用的？实际上,我的第一个问题是:群组是什么？我认为是指示插件将组中的元素作为单个单元处理,并且在任何元素触发一个元素的情况下也显示单个错误(例如,如果两个文本框被标记为需要,则使用规则如果在两个或两个中的任何一个中缺少一个值,那么如果两个元素有错误,则会显示一个错误标签,而不是两个),但我一直在尝试使用几个示例而无法使用以这种方式使它工作.那么,它们是为了什么？我应该如何使用它们？

Answer 1

该groups选项的作用之和是仅报告组内所有内容的一条错误消息.在给定的例子,如果你没有组fname和lname两者都需要,那么你会得到两个错误消息.有了这个小组,你只能得到一个.该组的两个元素仍然是必需的.

听起来你理解正确,但很难说你为什么没有得到这个例子.使用此HTML:

<form id="myform">
  First Name: <input type="text" name="fname" id="fname"/><br>
  Last Name: <input type="text" name="lname" id="lname"/><br>

    <input type="submit"/>
</form>?

这个验证代码:

$("#myform").validate({
    rules: {
        fname: { required: true },
        lname: { required: true }
    },
  groups: {
    username: "fname lname"
  },
  errorPlacement: function(error, element) {
     if (element.attr("name") == "fname" 
                 || element.attr("name") == "lname" )
       error.insertAfter("#lname");
     else
       error.insertAfter(element);
   }
 })?

它看起来不错:http: //jsfiddle.net/ryleyb/cbJj6/

我帮助某人的一个更复杂的例子是:使用jQuery validate插件检查是否选中了一个或多个复选框(具有不同的名称)
最终,该问题的组部分要求一组复选框中的一个复选框是检查,如果不是,只需要一条消息.