jQuery Validator自定义方法:如何在同一页面上使用多个表单?

时间:2011-11-13 06:07:04

标签: javascript jquery jquery-validate

我有一个表格,要求用户输入开始和结束长度,并且可以在页面上重复多次,具体取决于用户想要放入多少部分。我正在尝试添加一些验证。我在一个函数中添加了一个自定义验证器方法,我调用了任一字段的onChange,以检查结束长度是否大于start并且它正在工作。

当用户在页面上调用第二个表单时,该方法会中断并停止工作;它似乎保留了它当时的任何错误信息,无论我改变它持续存在,除非我超出仍然正确验证的范围界限。

输入标记在两个字段都有:onchange="validateTheForm(this.form);"

这是我的.js文件中的代码,每次输入更改时我都会在表单上调用它:

var validateTheForm = function(theForm) {
    $.validator.addMethod("endGreaterThanBegin", function(value, element) {
        return parseInt($('#endPoint').val(), 10) > parseInt($('#startPoint').val(), 10);
    }, "End Point Should be Greater than Start");

    $(theForm).validate({
        rules: {
            startPoint: {
                required: true,
                range: [0, 100]
            },
            endPoint: {
                required: true,
                range: [1, 100],
                endGreaterThanBegin: true
            }
        }
    });
    return true;
}

我认为尝试一遍又一遍地添加方法可能是一个问题,但每次我更改第一个表单上的任何一个字段并且从不中断时就会发生这种情况。我想知道在创建方法时是否与设置绑定到第一个表单的变量有关,并且从不将它们更新为新表单。

1 个答案:

答案 0 :(得分:1)

定义规则并应用验证器一次,并使用valid方法验证表单。

演示 - http://jsfiddle.net/2hA8M/17/

function validateTheForm(){
    $('#signupform').valid();
}