Jump to content

PHP form sending email with Ajax blocking


Jen2002
 Share

Recommended Posts

Hello, I'm starting with PHP, and I was working on a personnal project using AJAX.

Here is my simple  HTML form with 3 fields and a button, I was hopping sending email and giving the user the feedback without refreshing the page:

**************************************************************************

<!-- Contact Form -->
<form action="" method="post" id="ContactFrm">
           <div class="form-group">
                  <input id="name" type="text" class="form-control-input" placeholder="Name" name="Name" required>
           </div>
           <div class="form-group">
                   <input id="email" type="email" class="form-control-input" placeholder="Email" name="Email" required>
            </div>
                   <div class="form-group">
             <textarea id="message" class="form-control-textarea" placeholder="Message" name="Message" required></textarea>
                    </div>
              <div class="form-group">
                     <button id="submitBtn" type="button" class="form-control-submit-button" name="submit" value="submit">Submit</button>
               </div>
     </form>
                   
    <center><div id="feedback" class="form-control-input"></div></center>

**************************************************************************

Here is the script in the head section:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    <script>
        $(document).ready(function () {
            $('.submitBtn').click(function (e) {
                e.preventDefault();
            
                $.ajax
                    ({
                        type: "POST",
                        url: "mail_handler.php",
                        data: $('ContactFrm').serialize(),
                        success: function (html) {
                            alert('form was submitted');
                            //$('#ContactFrm')[0].reset();
                        }
                    });
            });
        });
    </script>

***************************************************************

And finally this is my mail_handler.php using PHPMailer wich works fine until I added the Ajax part calling the PHP:

<?php

error_reporting(E_ALL); ini_set('display_errors', 1);

#load phpmailer
use PHPMailer\PHPMailer\PHPMailer;
use PHPMailer\PHPMailer\Exception;
use PHPMailer\PHPMailer\SMTP;

require 'vendor/Exception.php';
require 'vendor/PHPMailer.php';
require 'vendor/SMTP.php';

#Receive user input
 $name = $_POST['name'];
 $email = $_POST['email'];
 $message = $_POST['message']; 

$mail = new PHPMailer();
$mail->IsSMTP();
$mail->SMTPDebug = 1;

$mail->Host = 'mail.jelaweb.com';
$mail->Port = 587;
$mail->SMTPSecure = 'tls'; 
$mail->SMTPAuth = false; 
$mail->From = $email;               
$mail->AddAddress('info@jelaweb.com');
$mail->Subject    =  "Hello";                      
$mail->Body = $message;                 
$mail->IsHTML(false);        


if (!$mail->send()) 
    {
      echo $mail->ErrorInfo;
      echo"<p>The mail() function failed.</p>";
    }
else
    {
      echo"<p>Email Sent !!!</p>\n";
    }
?>

*************************************************************

For some unknown reasons the call do not transfer fileds values to php, giving the error : PHP Notice:  Undefined index: for name, email and message.

I've been working for a while on this bug and tried a lot of things but can't get the message in the feedback section of the form.

Thanks in advance for nay help.

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.