Закрытие окна Fancybox - PullRequest
0 голосов
/ 28 марта 2020

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

$("form").submit(function() { //Change
    var th = $(this);
    $.ajax({
        type: "POST",
        url: "mail.php", //Change
        data: th.serialize()
    }).done(function() {
        $('#alert-massage').fadeIn(500);
        alert("Thank you!");
        setTimeout(function() {
            // Done Functions
            th.trigger("reset");
        }, 1000);
    });
    return false;
});

<div id="modal">
<div class="modal__wrap">
    <div class="modal__title">
        Write me
    </div>
    <form >
        <!-- Hidden Required Fields -->
        <input type="hidden" name="project_name" value="kylun-Serg">
        <input type="hidden" name="admin_email" value="kylun1serg@gmail.com">
        <input type="hidden" name="form_subject" value="popup-form">
        <!-- END Hidden Required Fields -->

        <input type="text" placeholder="Username" name="Name"   required>
        <input type="email" placeholder="Email" name = "E-mail"required>
        <input type="phone" placeholder="Phone" name = "Phone">
        <textarea placeholder="Massage" name="Massage"></textarea>
        <button type="submit" class="btn">
        Send
        </button>
    </form>
</div>

1 Ответ

1 голос
/ 28 марта 2020

при отправке формы вы можете вызвать функцию

<button type="submit" onclick="myFunction()" class="btn">Send</button>

, и функция действительно скроет модальное сообщение и отобразит сообщение об успешном завершении и перезагрузит текущую страницу.

function myFunction(){
document.getElementById("modal").style.display = "none";
alert('Form submitted successfuly.');
location.reload();
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...