jquery - 使用带有 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
 })

我知道他们正在创建一个名为“username”的组，该组将两个元素分组为一种形式:“fname”和“lname”，但该 groupd 是如何使用的？实际上，我的第一个问题是:这些组是用来做什么的？我认为这是指示插件将一组中的元素作为一个单元进行处理，并在任何元素触发一个错误时显示一个错误(例如，如果两个文本框被标记为必需，则使用 < strong>rules 元素，如果两个或两个元素中的任何一个缺少值，则显示一个错误标签，而不是两个(如果两个元素有错误)，但我一直在尝试几个例子，但未能以这种方式使其工作。那么，它们是做什么用的呢？我应该如何使用它们？

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/

我帮助某人的一个更复杂的例子在这里:Using the jQuery validate plugin to check if one or more checkboxes (with different names) are selected
最终，该问题的组部分要求选中一组复选框中的一个复选框，如果没有选中，则只需要一条消息。