У меня есть форма, которая динамически добавляет или удаляет поля ввода в зависимости от определенных выборов, которые были сделаны пользователем.
Базовая форма выглядит следующим образом, упрощенно:
<form action="...some/path..." id="MyForm" method="post">
<!-- the first input field is a select list, depending on the selected option, an ajax call will be made to update the div below with new input fields -->
<select name="selectList">
<option>#1</option>
<option>#2</option>
<option>#3</option>
<option>...</option>
</select>
<div id="UpdateThisSection"></div>
<input type="submit" value="Submit">
</form>
В зависимости от того, какую опцию пользователь выбирает из списка выбора, пользователю будут представлены различные поля ввода, которые отображаются в#UpdateThisSection div.
Поля ввода для опции # 1 будут следующими:
- Поле даты (обязательно), поэтому атрибут
required устанавливается в поле ввода,а также пользовательский атрибут data-type="Date" - Текст (необязательно), атрибут
required не установлен
Поля ввода для опции # 2 будут:
- Текст (необязательно), без атрибута
required установлено - Текст (необязательно), без атрибута
required установлено
Поля ввода для опции № 3 будутбыть:
- Текст (необязательно), атрибут
required не задан - Числовой (необязательно),
required набор атрибутов, а также пользовательский атрибут data-type="Numeric"
Проверка jquery реализована следующим образом:
$("#MyForm").validate();
$.validator.addMethod("usDate",
function (value, element) {
return value.match(/^(0?[1-9]|1[0-2])[/., -](0?[1-9]|[12][0-9]|3[0-1])[/., -](19|20)?\d{2}$/);
},
"Please enter a valid date."
);
$("input[data-type='Date']").each(function () {
if ($(this).prop("required")) {
$(this).rules("add",
{
usDate: true
});
}
});
$("input[data-type='Numeric']").each(function () {
$(this).rules("add",
{
number: true
});
});
Проверка работает отлично, если я открываю форму ивыберите любой вариант.Форма проверяется так, как должна.Однако, если я передумаю и выберу другой вариант из выпадающего списка, форма больше не будет корректно проверяться.При отправке я вижу, что форма проверяется в соответствии с требованиями предыдущей формы.
При просмотре объекта $("#MyForm").validate() на консоли invalid, а также свойство submitted все еще содержат информацию опредыдущая форма.Какой самый простой способ сбросить валидатор, когда новый вызов ajax загружает новый элемент формы?
Я пытался сбросить форму, используя $("#MyForm").validate().resetForm();, но он не очистил свойства, упомянутые выше.
Попытка очистить проверку, как предложено в , это сообщение stackoverflow-post также не решило проблему для меня.