针对动态字段的jquery验证

Question

我正在使用jQuery的验证插件,并希望验证许多动态添加的文本字段,以便根据单独的总字段检查它们的总和.

我已经写在过去我自己的验证方法,但只有简单的那些承担基本的正则表达式结构,很容易从附加methods.js文件重现.

具体来说,jQuery网站提供了一个使用addMethod()函数执行非常相似的操作的简单示例:

jQuery.validator.addMethod("math", function(value, element, params) { 
 return this.optional(element) || value == params[0] + params[1]; 
}, jQuery.format("Please enter the correct value for {0} + {1}"));

params参数的实现或多或少地记录在案.我能够找到如何在单独的stackoverflow线程中将内容传递给params .但是,在该示例中传入params的数组是静态的.我需要传递给params的数组根据"运行时"添加的动态添加行增长和缩小...

我已将完全剥离的版本上传到jsfiddle以供您查看. 请注意,代码中有一些注释嵌入了我有问题的地方,而且,我删除了删除功能,因为它只会增加混乱,并没有帮助说明这一点.

那么如何使用jQuery验证库来确保动态添加的字段添加到特定的总数？先感谢您!

Answer 1

这是我的验证器版本.

http://jsfiddle.net/linkabi9/shBxv/

你会注意到,我没有参数的静态数字,而是传递一个选择器.数组中的一个元素是存放字段的选择器.我给每个现有的和新的存款输入一个类"setamount1",你可以使用你想要的任何类.您设置此验证器的字段将是"总金额"字段.

我还在存款领域添加了一个实时的"更改"事件.这将在每次更改时运行验证.我必须警告你,这在整个表格上运行验证,而不仅仅是存款和总计字段.

现在,您可以在同一表单/页面中多次重用此验证器类型!

我继续把验证码放在下面.另外,验证器初始化的一个例子.

jQuery.validator.addMethod("depositsSum", function(value, element, params)
{       
    var amnts = 0;
    $(params[0]).each(function() {
        amnts += parseFloat($(this).val());
    });

    return this.optional(element) || amnts == parseFloat(value);
}, jQuery.format("Individual deposits must add up to the total!"));

$("#depositForm").validate({
    rules: {
        fullAmount: {
            depositsSum: [".amountset1"]
        }
    }
});