jQuery验证器 - 无法调用未定义错误的方法'调用' - 动态添加验证

时间:2013-03-28 10:00:12

标签: jquery jquery-validate

这是我动态更新jQuery验证的代码。在文档加载中,我创建验证。此代码用于动态更新电话号码验证。应用此验证后,当我在电话号码文本框中输入任何内容时,我无法调用未定义错误的方法“调用”。

 $("#phone").rules("remove");

$("#phone")
  .rules(
  "add",
  {
    required:true,
    minlength:5,
    maxlength:20,
    phoneUS:true,
    messages:{
    required: "Enter company phone number",
    minlength:"Phone number should contain a minimum of 5  characters",
    maxlength:"Phone number should contain a maximum of 20  characters",
    phoneUS:"Enter valid phone number"
  }

  });

提前致谢。怎么解决这个问题?

6 个答案:

答案 0 :(得分:23)

有四个潜在的问题。

1)您错过了messages部分的右括号。

$("#phone").rules("add", {
    required: true,
    phoneUS: true,
    messages: {
        required: "Enter company phone number",
        phoneUS: "Enter valid phone number"
    } //<-- this was missing 
});

DEMO:http://jsfiddle.net/A8HQU/2

2)a known bug使用messages方法添加rules('add')会破坏插件和/或规则。确保您包含 jQuery Validate版本1.11.1 或更好。

3)phoneUS规则要求包含the additional-methods.js file

4)rules('add')方法必须在 .validate()初始化函数之后

注意

您正在使用phoneUS规则,因此minlengthmaxlength完全是多余的,因为phoneUS规则已经在寻找精确的格式/长度。

答案 1 :(得分:9)

我有同样的问题,但原因不同。当我提出一个规则&#34;要求:true&#34;而不是&#34; required:true&#34;。

当您在规则中指定没有相应方法的验证时,会发生此错误。通过调试我发现异常显示我指定了一个规则&#34;要求&#34;通过方法名称是&#34; required&#34;。它尝试访问hashmap中的方法,并尝试.call(),即使找不到该方法,也会导致异常。

如果插件作者只是在这种情况下提出了一个自定义错误,那就说明&#34;规则要求&#39;没有方法&#34;它会更容易调试和认识到错字。

即使字段无效,这也是插件提交臭名昭着的原因。见&amp;投票支持我的问题报告 - https://github.com/jzaefferer/jquery-validation/issues/1212

答案 2 :(得分:7)

作为相关错误,如果您添加自定义规则,请使用:

150528 22:58:20 [ERROR] /usr/sbin/mysqld: Can't find file: './mysql/host.frm' (errno: 13)

但是在规则声明中用错误的名称引用它:

mysql

您将获得相同的$.validator.addMethod('field-is-valid', function (val, element) { ...})

答案 3 :(得分:1)

我最近两次遇到过类似的问题并且花了很多时间试图解决这个问题,所以我将在这里留下一个简单的解决方案。如果主持人认为这不是正确的地方,请告诉我。

运行此示例代码时发生错误:

$(document).ready(function () {

    $.validator.addMethod("numberEqualTo", function (value, element, parameter) {
        return parseInt(value) === parseInt(parameter);
    }, "Values must match");

    $("#example2").validate({
        focusInvalid: false,
        onkeyup: true,
        onfocusout: true,
        errorElement: "div",
        errorPlacement: function (error, element) {
            error.appendTo("div#errors");
        },
        rules: {
            "example2-fullname": {
                required: true,
                minlength: 5
            },
            "example2-phone": {
                required: true,
                number: true
            },
            "example2-zip": {
                required: true,
                number: true,
                rangelength: [3, 5]
            },
            "example2-value": {
                required: true,
                number: true,
                numberEqualTo: 10
            }
        },
        messages: {
            "example2-fullname": {
                required: "You must enter your full name",
                minlength: "First name must be at least 5 characters long"
            },
            "example2-phone": {
                required: "You must enter your phone number",
                number: "Phone number must contain digits only"
            },
            "example2-zip": {
                required: "You must enter your zip code",
                number: "Zip code must contain digits only",
                rangelength: "Zip code must have between 3 to 5 digits"
            },
            "example2-value": {
                required: "You must enter your value",
                number: "Value must be a digit",
                numberEqualTo: "Value must be equal to 10"
            }
        }
    });
});

为什么呢?出于某种原因,如果您明确指定:

onkeyup: true,
onfocusout: true,

程序将抛出提到的异常。如果您将以上选项中的任何一个或两个选项设置为&#39; true&#39;,则会出现这种情况。另一方面,如果你将BOTH设置为&#39; false&#39;或者一到“假”&#39;并删除另一个,它将按预期工作。

最重要的是:如果您删除或注释掉其中任何一个选项,您删除的选项将被设置为默认值,这是“真实”&#39;和WON&#34; T抛出任何错误。因此,可以完全按照您想要的方式自定义验证插件,您只需要记住不要将这些选项设置为“真正的&#39;明确。

我希望这会对某人有所帮助,尽管这个特定用户在这个问题中的实际问题已经解决了。

答案 4 :(得分:0)

上面的代码无效,因为它在属性列表后缺少}

答案 5 :(得分:-2)