bootstrap 5.2 alert success when send mail-CodePudding

I made a contact form. Everything works fine, I receive the emails as I wanted. Below you will find my code

contact.php

<?php

use PHPMailer\PHPMailer\PHPMailer;
use PHPMailer\PHPMailer\Exception;

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

if(isset($_POST["send"])){

    $body = $_POST['message'];
    $name = $_POST['name'];
    $phone = $_POST['phone'];
    $email = $_POST['email'];
    

    $mail = new PHPMailer(true);
    
    $mail->isSMTP();
    $mail->Host = 'smtp.gmail.com';
    $mail->SMTPAuth = true;
    $mail->Username = '[email protected]';
    $mail->Password = 'password';
    $mail->SMTPSecure = PHPMailer::ENCRYPTION_SMTPS;            //Enable implicit TLS encryption
    $mail->Port = 465;      
    $mail->setFrom('[email protected]');

    $mail->addAddress($_POST["email"]);

    $mail->isHTML(true);

    $mail->Subject = 'Projet web';
    $mail->Body = "Message:" . $body . "<br>Phone number: " . $phone . "<br>Name: " . $name . "<br>Mail: " . $email;

    $mail->send();

    echo "success";

    
}

index.php

         <div  data-aos="fade-left">
            <form id="contactForm" action="contact.php" method="POST">


                <div >
                    <span  id="basic-addon1"><i ></i></span>
                    <input type="text" id="name" name="name"  placeholder="Nom Prénom"
                        aria-label="Nom Prénom" aria-describedby="basic-addon2" required>
                </div>


                <!-- Email address input -->
                <div >
                    <span  id="basic-addon1">@</span>
                    <input type="text" id="email" name="email"  placeholder="Email"
                        aria-label="email" aria-describedby="basic-addon1" required>
                </div>

                <div >
                    <span  id="basic-addon1"><i ></i></span>
                    <input type="text" id="phone" name="phone"  placeholder="Téléphone"
                        aria-describedby="basic-addon2" required>
                </div>


                <!-- Message input -->
                <div >
                    <textarea  id="exampleFormControlTextarea1" rows="3"
                        placeholder="Decrivez le plus possible votre projet" name="message" required></textarea>
                </div>

                <!-- Form submit button -->
                <div >
                    <button  name="send" type="submit">Submit</button>
                </div>

            </form>

        </div>

What I would like is that when the message is sent there is a green bootstrap alert that appears at the level of the form after the mail is sent. Currently there is a page that opens where it is marked success but I would like to put the bootstrap alert instead at the level of the contact form. How to do?

CodePudding user response：

contact.php

<?php

use PHPMailer\PHPMailer\PHPMailer;
use PHPMailer\PHPMailer\Exception;

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

if(isset($_POST["send"])){

    $body = $_POST['message'];
    $name = $_POST['name'];
    $phone = $_POST['phone'];
    $email = $_POST['email'];
    

    $mail = new PHPMailer(true);
    
    $mail->isSMTP();
    $mail->Host = 'smtp.gmail.com';
    $mail->SMTPAuth = true;
    $mail->Username = '[email protected]';
    $mail->Password = 'password';
    $mail->SMTPSecure = PHPMailer::ENCRYPTION_SMTPS;            //Enable implicit TLS encryption
    $mail->Port = 465;      
    $mail->setFrom('[email protected]');

    $mail->addAddress($_POST["email"]);

    $mail->isHTML(true);

    $mail->Subject = 'Projet web';
    $mail->Body = "Message:" . $body . "<br>Phone number: " . $phone . "<br>Name: " . $name . "<br>Mail: " . $email;

    $mail->send();
    $_SESSION['mail_send'] = true; //take a flag in $_SESSION variable, (if it throw error related to session add SESSION_START in before this line. search ho to start SESSION)
    header("location:index.php");    
}
"index.php"
<div  data-aos="fade-left">
            <form id="contactForm" action="contact.php" method="POST">
                <?php if((isset($_SESSION['mail_send']) && ($_SESSION['mail_send']== true)){ // here this page will chack that session variable "mail_send" is created and "mail_send" is true then it will show alert, else not, and after show the alert it will unset the $_SESSION['mail_send'] ?>
                    <div  role="alert">
                    Mail send successfully!
                    </div>
                <?php 
                unset($_SESSION['mail_send']);
                }?>
                
                <div >
                    <span  id="basic-addon1"><i ></i></span>
                    <input type="text" id="name" name="name"  placeholder="Nom Prénom"
                        aria-label="Nom Prénom" aria-describedby="basic-addon2" required>
                </div>


                <!-- Email address input -->
                <div >
                    <span  id="basic-addon1">@</span>
                    <input type="text" id="email" name="email"  placeholder="Email"
                        aria-label="email" aria-describedby="basic-addon1" required>
                </div>

                <div >
                    <span  id="basic-addon1"><i ></i></span>
                    <input type="text" id="phone" name="phone"  placeholder="Téléphone"
                        aria-describedby="basic-addon2" required>
                </div>


                <!-- Message input -->
                <div >
                    <textarea  id="exampleFormControlTextarea1" rows="3"
                        placeholder="Decrivez le plus possible votre projet" name="message" required></textarea>
                </div>

                <!-- Form submit button -->
                <div >
                    <button  name="send" type="submit">Submit</button>
                </div>

            </form>

        </div>