Используя jQuery Validation plugin для проверки форм, как бы вы подтвердили, что строка имеет ровно X символов?
Как проверить точную длину с помощью проверки JQuery?
Ответ 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">