How to send a mail from popup without reloading the page using ajax and php

You want to send a mail from pop(modal) and you want to show the ‘thank you message’ on same popup without reloading the page. Here is the full guide step by step


<div class="modal" id="new_form">
    <div class="modal-dialog">
 <div class="row">
    <div class="col-md-7">
  <button class="close1 hidden-md hidden-sm hidden-lg" data-dismiss="modal">×</button>
  <div class="modal-content">
  <div class="modal-body modal-body1">
  <form method="POST" id="webinar_form">
  <h2>Apply For Webinar</h2>
      <div class="form-group">
   <label for="name">Full Name:</label>
   <input type="text" class="form-control" name="name" id="name" required>
      <div class="form-group">
   <label for="email">Email:</label>
   <input type="email" class="form-control" name="email" id="email" required>
      <div class="form-group">
   <label for="phone">Phone:</label>
   <input type="text" class="form-control" name="mobile" id="mobile" required>
     <div class="form-group">
   <label for="phone">Webinar:</label>
   <select class="form-control" name="webinar" id="webinar_select" required>
   <option value="">Select Webinar</option>
   <option value="Free formulas webinar">Free formulas webinar</option>
   <option value="Pivot Table & Dashboard webinar">Pivot Table & Dashboard webinar</option>
     <div class="form-group">
        <label style="width:100%">Webinar Time: <b id="webinar_time"></b></label>
     <button type="submit" name="submit" class="btn btn-default" id="form_btn">Submit</button>
     <div class="modal-body modal-body2">
  <div class="after-mail">
  <h2>Email Sent</h2>
  <p>Please check your email for further instructions.</p>
  <span>(If this email has not arrived in the next couple of minutes, check your Spam or Promotions folder)</span>
    <div class="col-md-5"><button class="close close1" data-dismiss="modal">×</button></div>


$("#webinar_form").on('submit',function(e) {
    var name = $("#name").val();
    var email = $("#email").val();
    var mobile = $("#mobile").val();
    var webinar_select = $("#webinar_select").val();
        type: 'POST',
        url: 'send_enquiry.php',
        success: function(data){
            if(data == 1){


$statusMsg = '';
$msgClass = '';
    // Get the submitted form data
    $email = $_POST['email'];
    $name = $_POST['name'];
    $mobile = $_POST['mobile'];
    $webinar = $_POST['webinar_select'];
        if(filter_var($email, FILTER_VALIDATE_EMAIL) === false){
            $statusMsg = 'Please enter your valid email.';
            $msgClass = 'errordiv';
            // Recipient email
            $toEmail = '';
            $emailSubject = 'Form submitted by'.$name;
            $emailSubject2 = 'Company Name';
     $htmlContent2 = 'Hello,
Thank you for showing interest in us. We will get back to you shortly
Thanks & Regards,
Your Company Name';
            $htmlContent = "<h2>Form Details</h2><br><table width='500' border='1' cellpadding='3px' style='border-collapse: collapse; border:1px;'>

    <td>Full name</td>
            // Set content-type header for sending HTML email
            $headers = "MIME-Version: 1.0" . "\r\n";
            $headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
            // Additional headers
            $headers .= 'From: '.$name.'<'.$email.'>'. "\r\n";
            // Send email
            echo '1';

We are using 2 mail functions. One mail will be sent to the admin and another will be sent to the person who is filling the form