Ajax function is executed twice how can I solve this issue?

J

Junior2018-04-27 17:07:58

PHP

Junior, 2018-04-27 17:07:58

I had a problem, the script sends a message to the mail twice, the first with the data that I entered, and the second is empty.
[ htmlform.php ]:

<!DOCTYPE html>
<html lang="ru">
<head>
  <meta charset="UTF-8">
  <title>Ajax-форма</title>
  <link rel="stylesheet" href="main.css">
</head>
<body>
  <form class="form" id="form" name="form">
    <input type="text" class="form-field" name="name" placeholder="Введите ваше имя">
    <input type="text" class="form-field" name="phone" placeholder="Введите ваш телефон">
    <button class="form-button"><span class="text-button">Отправить заявку</span></button>
  </form>
  <footer>
    <div class="overlay js-overlay-thank-you">
      <div class="popup js-thank-you">
        <h2>Спасибо за заявку</h2>
        <div class="close-popup js-close-thank-you"></div>
      </div>
    </div>
  </footer>
  <div id="otv">   
  </div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <script src="main.js"></script>
  <script src="jquery.maskedinput.js"></script>
</body>
</html>

[main.js]:

// Отправка заявки 
$(document).ready(function() {
  $('#form').submit(function() { // проверка на пустоту заполненных полей. Атрибут html5 — required не подходит (не поддерживается Safari)
    if (document.form.name.value == '' || document.form.phone.value == '' ) {
      valid = false;
      return valid;
    }
    $.ajax({
      type: "POST",
      url: "mail.php",
      data: $(this).serialize()
    }).done(function() {
      $('.js-overlay-thank-you').fadeIn();
      $(this).find('input').val('');
      $('#form').trigger('reset');
      $('#otv').load('mail.php');
    });
    return false;
  });
});
// Закрыть попап «спасибо»
$('.js-close-thank-you').click(function() { // по клику на крестик
  $('.js-overlay-thank-you').fadeOut();
});
$(document).mouseup(function (e) { // по клику вне попапа
    var popup = $('.popup');
    if (e.target!=popup[0]&&popup.has(e.target).length === 0){
        $('.js-overlay-thank-you').fadeOut();
    }
});

[mail.php]:

<?php
if($_POST['name']='' || $_POST['phone']=''){
    
}else{
$recepient = "[email protected]";
$siteName = "Тест";
$from = "test";

$name = trim($_POST["name"]);
$phone = trim($_POST["phone"]);
$message = "Имя: $name \nТелефон: $phone";

$pagetitle = "Заявка с сайта \"$siteName\"";
mail($recepient, $pagetitle, $message, "Content-type: text/plain; charset=\"utf-8\"\n From: $from");
echo 'Сообщение отправлено на '.$recepient;
}
?>

Reply

Answer the question

In order to leave comments, you need to log in

2 answer(s)

T

Troodi Larson, 2018-04-27
@troodi

Of course you load after sending $('#otv').load('mail.php') a script which is empty.

A

Alibek Musin, 2018-04-28
@Alibek_Mussin

Well, what is it? That's the condition
if($_POST['name']=='' || $_POST['phone']==''){