title: After sending email with PHPMailer show success/failure message on the same page without reloading or redirecting the page
body: <p>I have created a simple html &amp; bootstrap contact form which is backed by PHPMailer class to send an email. The program works perfectly till the sending of email. However, it is not showing the success/failure message on the same page and not clearing the fields also. </p>
  
  <p>The code which I have written for my demo program is below. Please append your solutions to the same code rather making another code of your own.</p>
  
  <p>index.html</p>
  
  <pre><code>&lt;form method="post" action="mail.php" id="contact-form" role="form"&gt;
                      &lt;div class="card-header"&gt;
                          &lt;h2 class="font-weight-bold text-center my-4"&gt;Contact us&lt;/h2&gt;
                          &lt;p class="text-center mx-auto mb-5"&gt;Do you have any questions? Please do not hesitate to
                              contact us directly. Our team will come back to you within
                              a matter of hours to help you.&lt;/p&gt;
                          &lt;div class="alert alert-success" id="success-message"&gt;&lt;span&gt;Thank you for contacting us. We will
                                  be in touch
                                  soon.&lt;/span&gt;&lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="card-body"&gt;
                          &lt;div class="row"&gt;
                              &lt;div class="col-md-6"&gt;
                                  &lt;div class="form-group "&gt;
                                      &lt;label for="name" class="is-required"&gt;Name&lt;/label&gt;
                                      &lt;input type="text" name="name" id="name" class="form-control" minlength="3"
                                          required&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                              &lt;div class="col-md-6"&gt;
                                  &lt;div class="form-group "&gt;
                                      &lt;label for="email" class="is-required"&gt;email&lt;/label&gt;
                                      &lt;input type="email" name="email" id="email" class="form-control" required&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="row"&gt;
                              &lt;div class="col-md-12"&gt;
                                  &lt;div class="form-group"&gt;
                                      &lt;label for="message" class="is-required"&gt;Message&lt;/label&gt;
                                      &lt;textarea name="message" id="message" rows="2" class="form-control"
                                          required&gt;&lt;/textarea&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="row"&gt;
                              &lt;div class="col-md-12"&gt;
                                  &lt;div class="text-center text-md-left"&gt;
                                      &lt;input type="hidden" name="action" value="sendEmail" /&gt;
                                      &lt;button id="submit-button" name="submit" type="submit" value="Send"
                                          class="btn btn-primary"&gt;&lt;span&gt;Send&lt;/span&gt;&lt;/button&gt;
                                  &lt;/div&gt;
                                  &lt;div class="status" id="status"&gt;&lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;div class="row"&gt;
                              &lt;div class="col-md-12"&gt;
                                  &lt;div class="status" id="status"&gt;&lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/form&gt;
  
  </code></pre>
  
  <p>jQuery/ajax</p>
  
  <pre><code> &lt;script&gt;
          $('form').validate();
          $(document).ready(() =&gt; {
              $('#success-message').hide();
              $('form').submit((e) =&gt; {
  
                  let formData = {
                      'name': $('#name').val(),
                      'email': $('#email').val(),
                      'message': $('#message').val(),
                      'submit': 1
                  };
  
                  $.ajax({
                      type: 'POST',
                      url: 'mail.php',
                      data: formData,
                      dataType: 'json',
                      encode: true
                  }).done((data) =&gt; {
                      if (data.success) {
                          $('#success-message').show();
                      } else {
                          alert('Something went wrong. Please try again!');
                      }
                  });
                  e.preventDefault();
              });
          });
      &lt;/script&gt;
  
  </code></pre>
  
  <p>mail.php</p>
  
  <pre><code>&lt;?php
      use PHPMailer\PHPMailer\PHPMailer;
      use PHPMailer\PHPMailer\Exception;
  
  // Load Composer's autoloader
      require 'vendor/autoload.php';
      // header('Content-Type: application/json');
  
      if (isset($_POST['submit'])) {
          $name = $_POST['name'];       // Sender's name
          $email = filter_var($_POST['email'], FILTER_VALIDATE_EMAIL);
          $message = $_POST['message'];    // Sender's message
  
          $errorEmpty = false;
          $errorEmail = false;
  
          if (empty($name) || empty($email) || empty($message)) {
              echo "&lt;span class='alert alert-danger'&gt; Name is required.&lt;/span&gt;";
              $errorEmpty = true;
          }
          if (filter_var($email, FILTER_VALIDATE_EMAIL)) {
              echo "&lt;span class='alert alert-danger'&gt; Please try entering a correct email.&lt;/span&gt;";
              $errorEmail = true;
          }
  
  
  
  
          // Instantiate PHPMailer class
          $mail = new PHPMailer(true);
  
          try {
              //Server settings
              $mail-&gt;SMTPDebug = 0;                                       // Enable verbose debug output
              $mail-&gt;isSMTP();                                            // Set mailer to use SMTP
              $mail-&gt;Host       = 'smtp.gmail.com';  // Specify main and backup SMTP servers
              $mail-&gt;SMTPAuth   = true;                                   // Enable SMTP authentication
              $mail-&gt;Username   = 'mymail@gmail.com';                     // SMTP username
              $mail-&gt;Password   = 'mypass';                               // SMTP password
              $mail-&gt;SMTPSecure = 'tls';                                  // Enable TLS encryption, `ssl` also accepted
              $mail-&gt;Port       = 587;                                    // TCP port to connect to
  
      //Recipients
              $mail-&gt;setFrom('mymail@gmail.com', 'My Name');
              $mail-&gt;addAddress($email, $name);     // Add a recipient
  
              $body = '&lt;p&gt;Hello &lt;strong&gt; Mr. ' . $name . '&lt;/strong&gt; &lt;br /&gt;&lt;br /&gt; We have received your enquiry "' .$message. '". &lt;br /&gt; We ensure you that the team is working on it. &lt;br /&gt;&lt;br /&gt; Thank you. &lt;/p&gt;';
  
              // Content
              $mail-&gt;isHTML(true);                                  // Set email format to HTML
              $mail-&gt;Subject = 'We received your query.';
              $mail-&gt;Body    = $body;
              // $mail-&gt;AltBody = strip_tags($body);
  
              $mail-&gt;send();
              // echo 'Message has been sent';
          } catch (Exception $e) {
              echo $e-&gt;errorMessage();
              echo "Mailer Error: " . $mail-&gt;ErrorInfo;
          }
      } else {
          echo "There was an error!";
      }
  ?&gt;
  
  
  </code></pre>
  
  <p>Your any help is highly appreciated. Thanks in advance.</p>