Как добавить AJAX предупреждение об ошибке отправки формы? - PullRequest
1 голос
/ 04 августа 2020

Начинающий веб-разработчик здесь. Я добавил основанную на учебнике форму PHP - AJAX - jQuery, в которой также есть загружаемый GIF. При тестировании я обнаружил, что скрытое, содержащееся в div сообщение «Успешная отправка» под формой заменяет загружаемый GIF, если при отправке любой формы успешно вставляется новая запись базы данных, и в любом случае при отправке не удается вставить новую базу данных. запись, загружаемый GIF останется видимым, и больше ничего не произойдет. Мне интересно, есть ли относительное простое изменение, которое я могу внести в код AJAX, чтобы, если отправка формы не приводит к новой записи в базе данных, тогда загружаемый GIF будет скрыт и отобразится другое предупреждение, содержащееся в div ( например, новое предупреждение, содержащееся в div, заключенное в двойные звездочки в приведенном ниже коде)? В качестве альтернативы, если этот вариант является более сложным, чем я думаю, я ценю любые предложения по интеграции предупреждения AJAX, чтобы просто уведомить пользователя о том, что отправка формы не была получена. Спасибо!

  • HTML Форма:
<form id="contact">
  ...
  <button name="submit" type="submit" id="submitBtn">Submit</button>
  <img src="../../images/loading-dots.gif" id="loader" style="display: none">
</form>
<div id="successMsg" class="style_success">Message sent successfully!</div>
**<div id="errorMsg" class="style_error">An error occurred. Please try contacting us via email instead.</div>**

* Последнее сообщение, содержащее div (заключенное в двойные звездочки), - это то, что я хочу отобразить, если есть ошибка при обработке данных формы.

  • AJAX:
$("#submitBtn").hide('fast');
$("#loader").show('fast');
$.ajax({
    url:"private/php_scripts/submission.php",
    data:{key:"saveData",name:name,email:email,message:message},
    method:"POST",
    success:function (response) {
        var data = response.split('^');
        if (data[1] == "saved") {
            $("#submitBtn").show('fast');
            $("#loader").hide('fast');
            $("#successMsg").show('fast');
            $("#successMsg").fadeOut(10000);
            $("form#contact").each(function () {
                this.reset();
            });
        }
    }
});

1 Ответ

0 голосов
/ 04 августа 2020

После прояснения моего вопроса для комментария @ StackSlave и дальнейшего размышления о том, что я пытаюсь выполнить sh, я понял, что все, что мне нужно сделать, это скопировать оператор if в случае успеха: функция и вставить его как else if оператор для данных! == сохранен, а затем измените #successMsg на #errorMsg для моего нового сообщения div. Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...