cptn3mo
@cptn3mo

Почему переходит по action в форме, когда по скрипту не должно?

Вот рабочяя форма:
plnkr.co/edit/2u0U9S5nZlcurphOZEAG?p=preview

У меня по сути одна форма: joxi.ru/gmvz1GeH9aX6ma
И все работает так же, но переходит по action, даже если форма невалидна. Можете ли подсказать, в чем проблема?

Код:
Тут код формы
<form action="call-order.php" method="post">
				<div class="hold-input">
					<input type="text" name="phone" placeholder="Пример: +7 123 45 67"/>
				</div>
				<div class="hold-btn">
					<button class="btn" onclick="validate(this.form)" type="submit">Заказать звонок</button>
				</div>
			</form>

Тут код скрипта
<script>
    function showError(container, errorMessage) {
      container.className = 'error';
      var msgElem = document.createElement('span');
      msgElem.className = "error-message";
      msgElem.innerHTML = errorMessage;
      container.appendChild(msgElem);
    }

    function resetError(container) {
      container.className = '';
      if (container.lastChild.className == "error-message") {
        container.removeChild(container.lastChild);
      }
    }

    function validate(form) {
      var elems = form.elements;

      resetError(elems.phone.parentNode);
      if (!elems.phone.value) {
        showError(elems.phone.parentNode, 'Укажите телефон');

      }

    }
  </script>

  • Вопрос задан
  • 192 просмотра
Пригласить эксперта
Ответы на вопрос 1
@maxsolovev
Frontend-developer
Код сам по себе хреновый, но если не углубляться, можно сделать так:
function validate(form) {
      form.preventDefault()
      var elems = form.elements;

      resetError(elems.phone.parentNode);
      if (!elems.phone.value) {
        showError(elems.phone.parentNode, 'Укажите телефон');

      }
     
    }
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы