Как открыть popup после отправки формы?

Question

Есть такая форма

<form action="check.php" method="post" class="form" >
   
   <div class="popup-form"> 
    <input type="text" name="name" placeholder="Ваше имя" required pattern="[а-яА-Я]+">
    </div>

    
     <div class="popup-form"> 
<input type="text"  name="tf" placeholder="Ваш телефон" required>
</div>


<div class="popup-form"> 
 <input type="text"  name="email" placeholder="Ваш email" required>
</div>

Так реализован popup

 $('.open-popupp').click(function(e) {
e.preventDefault();
$('.popupp-bg').fadeIn(800);
$("html").addClass("no-scroll");
});



  $('.close-popupp').click(function() {
$('.popupp-bg').fadeOut(800);
    $("html").removeClass("no-scroll");
 });

Popup открывается сразу после нажатия на кнопку, минуя отправку формы и валидацию. Нужно, чтобы popup не открывался, если поля не заполнены корректно. Если же поля заполнены корректно, то отправляется форма и после открывается popup. Помогите пожалуйста сделать это.

Answer 1

Форма у вас как отправляется? По коду видно что без AJAX. В таком случае у вас, в принципе не получится силами javascript отловить тот факт что форма отправилась.

В вашем случае вероятней всего проще всего будет добавить код этого всплывающего окна на страницу, где идет работа с данными формы. Т.е. в check.php и уже там, в случае если данные корректны, то просто показывать всплывающее окно. Без привязки к каким-либо конпкам и событиям.

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

БЛОГ НА HUSL

Как открыть popup после отправки формы?

Ответы (1 шт):