HTML передача действия отправки формы в php почтовый обработчик. php с использованием ajax не получение отправлений по почте - PullRequest
0 голосов
/ 06 августа 2020

Вот форма html

      <!DOCTYPE html>
    <html lang="en">
    <head>
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    </head>
    <body>
        
    <form id="form" action=""  name="form" class=" f-color " >
        <div class="form-group ">
            <label for="contactusername">Name</label>
            <input type="text " name="name" class="form-control " placeholder="Enter Your Name" id="contactusername " required>
        </div>
        <div class="form-group ">
            <label for="contactemail ">Email</label>
            <input type="email " name="email" class="form-control " placeholder="Enter Your Email" id="contactemail " required>
        </div>
        <div class="form-group ">
            <label for="contactcomment ">Your Message</label>
            <textarea name="msg" class="form-control " placeholder="Enter Your Message Here" rows="5 " id="contactcomment " required></textarea>
        </div>
        <input type="submit" name="submit" value="Send" class="btn btn-block bg-light mt-4 py-3 text-uppercase font-weight-bold">
        
    </form>
</body>
</html>

Ajax используемый код

<script>
    $(function () {
      $('form').bind('submit', function () {
        $.ajax({
          type: 'post',
          url: 'process.php',
          data: $('form').serialize(),
          success: function () {
            alert('form was submitted');
          }
        });
        return false;
      });
    });
  </script>

Процесс. php здесь

<?php 
    if(isset($_POST['submit'])){
        $name=$_POST['name'];
        $email=$_POST['email'];
        $message=$_POST['msg'];
        
        $to='email@gmail.com';
        $subject='Form submission';
        $message="Name: ".$name."\n"."message:".$message;
        $headers="From: ".$email;
        if(mail($to, $subject, $message, $headers))
        {
            echo "<h1>Sent success! Thank you"." ".$name."</h1>";
        }
        else{
            echo "Something went wrong!";
        }
    }
?>

Когда я помещаю process. php в действие в форме, я получаю отправку формы на свой адрес электронной почты, но страница меняется на пустую страницу с сообщением об успешном завершении. Чтобы избежать этого, я попытался использовать ajax, но не смог. Как новичок, Я где-то застрял. Помогите мне решить эту проблему и как мне показать сообщение «Успешно отправлено» в том же окне?.

1 Ответ

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

Когда вы добьетесь успеха ajax, вы должны поместить данные куда-нибудь, например, я помещаю в конце тела.

<script>
$(function () {
  $('form').bind('submit', function () {
    $.ajax({
      type: 'post',
      url: 'process.php',
      data: {name: $('input[name="name"]').val(), email: $('input[name="email"]').val(), msg: $('input[name="msg"]').val(), submit: true},
      success: function (result) {
        document.body.appendChild(result);
      }
    });
    return false;
  });
});
</script>

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

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
    
<form id="form" action=""  name="form" class=" f-color " >
    <div class="form-group ">
        <label for="contactusername">Name</label>
        <input type="text " name="name" class="form-control " placeholder="Enter Your Name" id="contactusername " required>
    </div>
    <div class="form-group ">
        <label for="contactemail ">Email</label>
        <input type="email " name="email" class="form-control " placeholder="Enter Your Email" id="contactemail " required>
    </div>
    <div class="form-group ">
        <label for="contactcomment ">Your Message</label>
        <textarea name="msg" class="form-control " placeholder="Enter Your Message Here" rows="5 " id="contactcomment " required></textarea>
    </div>
     <div class="btn btn-block bg-light mt-4 py-3 text-uppercase font-weight-bold" onclick="sendLetter()" >Send</div>
    
</form>
</body>
</html>

<script>
 function sendLetter() {
    $.ajax({
      type: 'post',
      url: 'process.php',
      data: {name: $('input[name="name"]').val(), email: $('input[name="email"]').val(), msg: $('input[name="msg"]').val(), submit: true},
      success: function (result) {
        document.body.appendChild(result);
      }
    });
  }
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...