动态输入数组元素的 JQuery 验证答案

【问题标题】：JQuery Validation of Dynamic Input Array Elements动态输入数组元素的 JQuery 验证
【发布时间】：2015-07-21 11:51:05
【问题描述】：

我有一个表单，用户可以在其中添加他打算购买/出售的商品。我拥有的相应验证规则如下：

rules: {
                'items[][name]': {
                    required: true
                },
                'items[][description]': {
                    required: true
                },
                'items[][rate]': {
                    required: true,
                    number: true
                },
                'items[][quantity]': {
                    required: true,
                    number: true
                }
        }
errorPlacement: function (error, element) {
                error.appendTo('#' + element.attr('id') + '_error');
            }

现在，用户还可以向表单添加新项目。为此，我克隆了第一行并将其附加到最后一行。对应代码如下：

var $clone = original.clone().removeAttr('id'); // original is the initial first row of items
                    $clone.find(':text') // get the text inputs
                        .val('') // reset their values
                        .removeClass('error'); // remove the error classes if any    

    /*
    * I have an error span corresponding to each input where I display the errors.
    * Here, i get the input and span elements, split them in two groups, then 
    * add a random seed to each of them to get a unique id to be used by jQuery errorHandler to place the error
    */
                    var $formElements = $clone.find('input:text, span'),
                        $even = $formElements.filter(':even'),
                        $odd = $formElements.filter(':odd');

                    for (var i = 0; i < $even.length; i++) {
                        var idParts = $($even[i]).attr('id').split('__');
                        var seed = Date.now();

                        $($even[i]).attr('id', idParts[0] + seed + '_' + idParts[1]);
                        $($odd[i]).attr('id', idParts[0] + seed + '_' + idParts[1] + '_error');
                    }

我的问题是：

-> 仅验证静态创建的第一个项目行。

我知道 jQuery 验证器需要每个字段的唯一名称。但是，在这种情况下，我需要一组项目。反正新创建的item字段也是同名的，不应该自动验证吗？

如果不是，那么通过维护一个项目数组来解决什么问题？

提前致谢。

【问题讨论】：

在这个小提琴中使用索引jsfiddle.net/cjqvnnho/1

标签： javascript jquery jquery-validate

【解决方案1】：

那么通过维护一个项目数组来解决什么问题？

他们必须每个人都有一个唯一的name。因此，当您创建它们时，请在 name 上使用您的索引，就像您已经在 id 上所做的那样......

item[1], item[2], etc.

此外，当您创建它们时，您将使用the .rules('add') method 将规则添加到每个元素。

换句话说，您不能简单地克隆它们并期望一切都自动运行。

【讨论】：