Сообщения проверки JQuery отображаются только после нескольких отправок

Question

Я пытаюсь проверить форму с помощью плагина jquery-validate. На html-странице не отображаются сообщения об ошибках проверки, пока я не нажму дважды кнопку «Отправить». Я знаю, что событие отправки принимается при каждом нажатии (включая первый), потому что я поместил предупреждение в javascript для проверки.

Я также вижу отправленную форму, потому что вижу параметры, отображаемые в адресной строке после первого щелчка. Нужно ли что-то делать, чтобы сообщения об ошибках появлялись в первый раз?

Вот как я добавляю валидацию:

<script type="text/javascript">
$("form").submit(function() {
    $("form").validate({
        rules: {
            match: "required",
            limit: "required"
        },
        messages: {
            match: "Please enter a match"
        },
    });
});
</script>

Here is a snippet of my form:

<form action="#">
  <fieldset>
    <legend>Smart Playlist</legend>
    <div class="control-group">
      <label class="control-label">
      <input type="checkbox" name="match" value="match" class="chkbox"/>
      </label>
   </div>
  </fieldset>
</form>

Answer 1

Вам не нужно заключать его в обработчик .submit(), потому что Validation Plugin уже позаботится об этом. Пожалуйста, обратитесь к официальной демонстрационной странице для рабочих примеров.

$(document).ready(function() {

    $("form").validate({
        rules: {
            match: "required",
            limit: "required"
        },
        messages: {
            match: "Please enter a match"
        } // <- removed trailing comma
    });

});

Кстати, у вас также есть запятая после опций messages:. Определенные версии IE могут подавиться этим. Это "Завершающая запятая смерти" , и он влияет только на определенные версии IE ... инструменты других браузеров могут не помечать его как ошибку, поскольку технически это не ошибка

---

Более подробное объяснение происходящего:

Поскольку вы вложили .validate() в .submit(), функция проверки даже не загружается, пока вы не нажмете кнопку submit. Поскольку он еще не загружен, когда вы нажмете «Отправить», проверка не будет выполняться. Затем, когда вы нажмете «Отправить» во второй раз, функция будет загружена, поэтому она будет работать нормально.

Когда вы заключаете .validate() в document.ready, плагин валидации загружается сразу после завершения загрузки DOM. Таким образом, он готов и ждет, когда вы будете взаимодействовать с вашей формой, и он будет работать правильно при первой отправке.

Answer 2

Я бы не советовал использовать submit () для активации проверки формы. Вместо этого используйте кнопку отправки:

$('input[type=submit]').click(function(event) {
   // Do your validation, if it fails use event.preventDefault(); 
});