Kendo UI Validator - Обработка входов с одинаковыми атрибутами имени
У меня в настоящее время есть форма, подобная ниже:
<form action="/" method="post" id="myForm">
<div class="row">
<input type="text" name="rowValue" class="rowValue">
</div>
<div class="row">
<input type="text" name="rowValue" class="rowValue">
</div>
<div class="row">
<input type="text" name="rowValue" class="rowValue">
</div>
<div class="row">
<input type="text" name="rowValue" class="rowValue">
</div>
<input type="submit" value="Submit">
</form>
Немного предыстории: JS используется для добавления X количества новых "строк" в форму.
Я пытался с помощью:
var myForm = $('#myForm').kendoValidator({
/* rules/messages go here*/
}).data('kendoValidator');
myForm.validate();
Я получаю только одно сообщение об ошибке на первом input[name='rowValue']
,
JS Fiddle
Я подозреваю, что Kendo Validator нужны уникальные атрибуты имени для правильной проверки. Это позор, поскольку многие языки бэкэнда могут принимать идентичные атрибуты имен, поскольку они объединяют значения или преобразуют их в массив или коллекцию (ASP.NET).
Есть ли способ заставить Kendo UI Validator проверять поля формы с идентичными атрибутами имени?
1 ответ
Решение
Ваше подозрение верно. Вы можете настроить валидатор для своего варианта использования следующим образом:
kendo.ui.Validator.prototype.validateInput = function (input) {
input = $(input);
var that = this,
template = that._errorTemplate,
result = that._checkValidity(input),
valid = result.valid,
className = ".k-invalid-msg",
fieldName = (input.attr("name") || ""),
lbl = input.parent().find("span" + className).hide(),
messageText;
input.removeAttr("aria-invalid");
if (!valid) {
messageText = that._extractMessage(input, result.key);
that._errors[fieldName] = messageText;
var messageLabel = $(template({
message: messageText
}));
that._decorateMessageContainer(messageLabel, fieldName);
if (!lbl.replaceWith(messageLabel).length) {
messageLabel.insertAfter(input);
}
messageLabel.show();
input.attr("aria-invalid", true);
}
input.toggleClass("k-invalid", !valid);
return valid;
};
Обратите внимание, что в этом методе есть несколько упрощений, поэтому он может нарушаться в определенных угловых случаях.
( демо)