IT_Highlander
@IT_Highlander

Как отправить данные только после валидации формы HTML5?

Есть форма на сайте, отправляются данные через ajax на сервер с node js.
<form action="/page-mail" id="email-form" class="form" method="post" onSubmit="return false;">
          <input type="text" id="form__fname" name="first_name" placeholder="First Name ">
          <input type="text" id="form__lname" name="last_name" placeholder="Last Name ">
          <input type="email" class="form__email" name="email" placeholder="Business email *" required>
          <input type="phone" class="form__phone" name="phone" placeholder="Phone number *" required>
          <p class="error-msg"></p>
          <button type="submit" class="form__submit" id='sendButton' >Download now</button>
        </form>


$(document).ready(function() {
      $("#email-form").submit(function(e) {
        var action = $(this).attr("action");
        var ser = $(this).serialize();
        var that = this;
        $.ajax({
            type : "POST",
            url : action,
            data : ser,
            complete : function(data) {
                if (data.responseText == "true") {
                    ga('send', 'event', { eventCategory: '', eventAction: ''});
                    window.location.replace('/page-thank-you');
                } else {
                    $(".error-msg").html('<div class="alert-box alert">' + data.responseText + '</div>');
                    $("#sendButton").attr('disabled', false);
                }
            }
        });
        return false;
      });
    });


Сейчас данные отправляются при любом раскладе без валидации не смотря на required в инпутах (и перекидывает на than you page). Как правильно прикрутить проверку валидации стандартной? Чтобы при нажатии на submit кнопку появлялись стандартные ошибки сначала, а отправка уже после того как валидация пройдена?
  • Вопрос задан
  • 509 просмотров
Пригласить эксперта
Ответы на вопрос 1
Странно, валидация нормальная работает без проблем
https://jsfiddle.net/azh2L6x0/1/
У вас точно страница HTML5?
htmlbook.ru/html/%21doctype
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы