Подтвердить что ты не робот

Как проверить точную длину с помощью проверки JQuery?

Используя jQuery Validation plugin для проверки форм, как бы вы подтвердили, что строка имеет ровно X символов?

4b9b3361

Ответ 1

Поскольку для этого нет (в настоящее время) встроенного метода, вам нужно добавить свой собственный метод. Это будет работать:

jQuery.validator.addMethod("exactlength", function(value, element, param) {
 return this.optional(element) || value.length == param;
}, $.validator.format("Please enter exactly {0} characters."));

Что можно было бы использовать следующим образом:

$("#formtovalidate").validate({
  rules: {
    somefield: {
      exactlength: 10
    }
   });

Обновление - как это работает

Меня спросили, как это работает. Я не знаю всех подробностей; Я смоделировал этот метод на ранее существующих. Тем не менее, это моя лучшая попытка объяснить это.

  • Функция принимает значения value, element и param.
    • value - это значение, введенное в проверяемое поле
    • element - это само поле
    • param - это то, что приходит после типа правила и двоеточия. В приведенном выше примере это 10 в exactlength: 10
  • Следующая строка - это оператор return. Это вернет окончательный вердикт метода проверки обратно к коду, который его вызвал. Любой метод проверки, который возвращает true, говорит: "это поле проходит проверку!" Он вернет значение строки.
  • За return следуют два объявления, разделенные оператором 'или' (||).
    • Оператор || означает "оценить элемент слева от него. Если это правда, верните true. Если нет, попробуйте один справа. Если это правда, верните true. В противном случае верните false. '
      • Элемент слева - this.optional(element). Если элемент не требуется в ваших правилах, это вернет true, а также будет проверка. Что означает "Если я не говорю вам, что это поле требуется, мне все равно, проверяет ли он".
      • Если поле требуется, мы переходим в правую сторону ||. Это фактический тест проверки. Он сравнивает длину ввода поля с указанной вами длиной. Если они одинаковы, он возвращает true, метод возвращает true, а проверка проходит. В противном случае проверка не выполняется.

Что об этом. Дополнительную помощь можно найти в документации в частности, о пользовательских методах проверки.

Ответ 2

Пример:

rules : {
"someFieldName":{digits:true,minlength:20,maxlength:20}
}

Ответ 3

Вы также можете сделать существующий метод rangelength поддержкой точного диапазона, предоставив динамическое сообщение, подобное этому:

$.extend($.validator.messages, {
    rangelength: function(args, inputElement) {
        var isExactRange, min, max;

        // Cast arguments as numbers
        min = Number(args[0]);
        max = Number(args[1]);

        isExactRange = min === max;

        if (isExactRange) {
            return 'Please enter exactly ' + min + ' characters.';
        }


        return 'Please enter between ' + min + ' and ' + max + ' characters.';
    }
);

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

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

Чтобы вернуться к сообщению по умолчанию rangelength, замените

'Please enter between ' + min + ' and ' + max + ' characters.'

с

$.validator.messages.rangelength

Было бы неплохо, если бы официальная документация была обновлена, так как трудно ориентироваться и не описывать все функциональные возможности плагина.

Ответ 4

Самый простой способ - использовать существующие методы проверки с помощью атрибутов данных, а затем просто настроить собственное сообщение проверки для ясности.

<input data-rule-minlength="8" data-rule-maxlength="8" data-msg-minlength="Exactly 8 characters please" data-msg-maxlength="Exactly 8 characters please">