Проверяйте разные поля по нажатию разных кнопок в одной и той же HTML-форме через плагин JQuery Validate - PullRequest
3 голосов
/ 07 января 2011

например. Скажем, у меня есть два текстовых поля A, B и две кнопки C, D в форме. Затем я хочу, чтобы при нажатии кнопки C, если действительным было только текстовое поле A, то форма действительна, а при нажатии кнопки D, если действительным было только текстовое поле B, форма действительна.

Кто-нибудь знает, как это сделать?

Ответы [ 2 ]

2 голосов
/ 16 февраля 2011

Использовать опцию игнорирования.

$("form").validate({ignore: ".ignore"});

$("#c").click(function(){
   //$("#a").removeClass("ignore");
   //$("#b").addClass("ignore");
   $(".step1").removeClass("ignore");
   $(".step2").addClass("ignore");
   $("form").valid();
});

$("#d").click(function(){
   //$("#a").addClass("ignore");
   //$("#b").removeClass("ignore");
   $(".step1").addClass("ignore");
   $(".step2").removeClass("ignore");
   $("form").valid();
});

РЕДАКТИРОВАТЬ: как указано в моем комментарии @ dannie.f post

0 голосов
/ 26 апреля 2011

Приведенный выше ответ направил меня в правильном направлении, но у меня это не сработало. Если у вас много полей, было бы утомительно добавлять и удалять классы для каждого поля при нажатии кнопки. Кроме того, вам нужно знать идентификаторы или классы полей, которые нужно игнорировать.

Это решение, которое я придумал. Я создал группы проверки с помощью divs и использовал селектор jquery : not , чтобы сказать валидатору игнорировать любое поле, не содержащееся в этой группе.

<html>
<head>
<script type="text/javascript">
   $(function(){
      section1Validator = $("#form1").validate(
        { ignore: ":not(#section1 *)" });

      section2Validator = $("#form1").validate(
        { ignore: ":not(#section2 *)" });

     $("#c").click(function(){
           if (section1Validator.form()) {
                // do something when form is valid
           }
      });

      $("#d").click(function(){
           if (section2Validator.form()) {
                // do something when form is valid
           }
      });
   })
</script>
</head>

<body>
<form id="form1">
   <div id="section1">
      <input id="a" name="a" type="text" class="required"/>
      <button id="c" type="buttom">submit</button>
   </div>
   <div id="section2">
      <input id="b" name="b" type="text" class="required"/>
      <button id="d" type="button">submit</button>
   </div>
</form>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...