JQuery validator - Невозможно вызвать метод "вызов" ошибки undefined - при динамическом добавлении проверки

Это мой код для динамического обновления проверки jQuery. В загрузке документа я создаю проверку. Этот код используется для динамического обновления номера телефона. После применения этой проверки, когда я ввожу что-либо в текстовое поле телефонного номера, я получаю не могу вызвать метод "вызов" ошибки undefined.

 $("#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"
  }

  });

Спасибо заранее. Как это решить?

Ответы

Ответ 1

Существует четыре потенциальные проблемы.

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) Существует известная ошибка, где добавление messages с использованием метода rules('add') ломает плагин и/или правило. Убедитесь, что вы включили jQuery Validate version 1.11.1 или лучше.

3) Правило phoneUS требует включения файла additional-methods.js.

4) Метод rules('add') должен появиться после функции инициализации .validate().

Примечание

Вы используете правило phoneUS, поэтому minlength и maxlength являются полностью лишними, так как правило phoneUS уже ищет точный формат/длину.

Ответ 2

У меня была та же проблема, но с другой причиной. Та же проблема возникает, когда я устанавливаю правило "require: true" вместо "required: true".

Эта ошибка возникает, когда вы указываете в своих правилах валидацию, которая не имеет соответствующего метода. Через отладку я обнаружил, что исключение показывает, что я указал правило "require" по имени метода "required". Он пытается получить доступ к методу внутри хэш-карты и пытается .call(), даже если метод не найден, что приводит к исключению.

Если автор плагина просто бросил пользовательскую ошибку в этом случае, заявив, что "Правило" требует "не имеет метода", было бы легче отлаживать и распознавать опечатку.

Это также та же причина печально известной проблемы с отправкой плагина, хотя поля недействительны. Смотрите и проголосуйте за мой отчет о проблеме - https://github.com/jzaefferer/jquery-validation/issues/1212

Ответ 3

Как связанная ошибка, если вы добавите настраиваемое правило, используя:

$.validator.addMethod('field-is-valid', function (val, element) { ...})

но затем ссылайтесь на него в своем объявлении правил с неправильным именем:

$(element).rules('add', {
    "field-valid": true
})

вы получите тот же Cannot call method call of undefined.

Ответ 4

Недавно я столкнулся с подобной проблемой дважды и потратил много времени, пытаясь понять это, поэтому я собираюсь оставить здесь простое решение. И если модератор думает, что это не подходящее место, просто дайте мне знать.

Ошибка при запуске этого примера кода:

$(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,

программа выбросит указанное исключение. Это тот случай, когда вы устанавливаете ANY или BOTH выше параметров на "true". С другой стороны, если вы установите BOTH на "false" или ONE на "false" и удалите другой, он будет работать, как ожидалось.

Самое главное: если вы удалите или закомментируете любой из этих параметров, тот, который вы удалили, будет установлен на значение по умолчанию, то есть "true" И WON "T" выдает любую ошибку. Таким образом, можно настроить плагин проверки точно так, как вы хотите, вам просто нужно не помнить, чтобы эти параметры не были "истинны" явно.

Я надеюсь, что это поможет кому-то, несмотря на то, что фактическая проблема в этом вопросе для этого конкретного пользователя уже решена.

Ответ 5

Выше код не будет работать, потому что он отсутствует } после списка свойств.