Валидатор jquery - проверка только видимых элементов
У меня есть кнопка, которая скрывает / показывает div. Все видимые элементы являются "обязательными", но добавление ignore: ": hidden" после правил проверки не работает... Вот код:
<script type="text/javascript">
$(document).ready(function(){
$("#myForm").validate({
rules: {
name: "required",
age: "required",
height: "required",
ignore: ":hidden"
}
})
});
</script>
</head>
<body>
<form id="myForm" name="myForm" method="post" action="" >
<input type="radio" name="checkAge" value="adult" onclick="$('#minorRequisites').hide();" />Adult<br/>
<input type="radio" name="checkAge" value="minor" onclick="$('#minorRequisites').show()" checked="checked"/>Child<br/>
Name <input id="name" name="name" type="text" /><br/>
<div id="minorRequisites">
Age <input id="age" name="age" type="text" /><br/>
Height <input id="height" name="height" type="text" /><br/>
</div>
<input type="submit" />
</form>
</body>
Я хочу иметь возможность отправить форму с указанием только имени, если отмечен флажок "Взрослый"... Есть идеи?:)
2 ответа
Вы можете указать выражения зависимости в вашем required
правила, чтобы они игнорировали элементы, если они не видны:
$("#myForm").validate({
rules: {
name: "required",
age: {
required: "#age:visible"
},
height: {
required: "#height:visible"
}
}
});
Вы можете увидеть результаты в этой скрипке.
РЕДАКТИРОВАТЬ: ignore
также будет работать, но это вариант, а не правило, поэтому вы должны написать:
$("#myForm").validate({
ignore: ":hidden",
rules: {
name: "required",
age: "required",
height: "required"
}
});
Пожалуйста, попробуй ignore: ":not(:visible)"
вместо ignore: ":hidden"
,