При form.submit() опускается проверка полей на required

356

20 апреля 2017, 16:57

Есть форма с инпутом, который обьязателен для заполнения

<form action="" id="go">
    <input type="text" name="name" class="" placeholder="set-name" required="">
    <input type="submit">
</form>

И если через javascript сделать submit, то форма отправляется, без проверки на required

document.getElementById("go").submit();

А если нажать на кнопку "Отправить" - тогда проверка есть, и не отправляет форму пока не заполнишь...

Почему так происходит, почему js не проверяет поля формы?

Chrome 57.0.2987.133

Firefox 52

Answer 1

При вызове метода .submit() проверка на валидность не осуществляется. Предполагается, что при ручной отправке это сделано самостоятельно. Потому не забываем вызывать метод .checkValidity() перед отправкой:

let $form = document.getElementById('form'),
    $submitBtn = document.getElementById('submit');
$submitBtn.addEventListener('click', function() {
  if( $form.checkValidity() ) {
    $form.submit();
  } else {
    // ваша обработка ошибок
  }
});

Источник:

Метод submit

Answer 2

Можно не вызывать событие submit, а имитировать событие нажатия кнопки, тогда проверка должна быть. С помощью jQuery это можно сделать так: