title: How to send an email using jQuery and POST
body: <p>Update: Final working code is at the very bottom of question I left the rest of the code so you can see the process hope it helps someone in the future.</p>
  
  <p>I am trying to send an email to myself (which is working) using only jQuery and an external php file, however, the email isn't picking up any of the data. I have the following code.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;section&gt;
      &lt;form enctype="multipart/form-data"&gt;
          &lt;fieldset class="margin-b"&gt;
              &lt;legend&gt;Contact Me&lt;/legend&gt;
              &lt;label for="form_name"&gt;Name:&lt;input name="form_name" id="form_name" type="text" value="" required autofocus &gt;&lt;/label&gt;
              &lt;label for="form_email"&gt;Email:&lt;input type="email" name="form_email" id="form_email" value=""&gt;&lt;/label&gt;
              &lt;label for="form_msg"&gt;Message:&lt;textarea name="form_msg" id="form_msg" rows="5"&gt;&lt;/textarea&gt;&lt;/label&gt;
          &lt;/fieldset&gt;
          &lt;input type="submit" name="submit" id="submit" value="Submit"&gt;
      &lt;/form&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>var data = {
    name: $("#form_name").val(),
    email: $("#form_email").val(),
    message: $("#form_message").val()
  };
  $.ajax({
    type: "POST",
    url: "email-php.php",
    data: data,
    success: function(){
      $('.success').fadeIn(1000);
    }
  });
  </code></pre>
  
  <p>PHP</p>
  
  <pre><code>&lt;?php
  if($_POST){
    $name = $_POST['name'];
    $email = $_POST['email'];
    $message = $_POST['message'];
  
    //send email
    mail("email@domain.com", "From: " .$email, $message);
  }
  ?&gt;
  </code></pre>
  
  <p>EDIT: I took the above from various answers on Stack Overflow however couldn't figure out what I am missing or doing wrong. I took most of it from this question here <a href="https://stackoverflow.com/questions/15300470/jquery-ajax-form-using-mail-php-script-sends-email-but-post-data-from-html-fo">jQuery AJAX form using mail() PHP script sends email, but POST data from HTML form is undefined</a></p>
  
  <p>UPDATE: After @inarilo's suggestion below I have changed everything to the following and now I don't get an email at all. This definitely looks like the better option so I would like to get it to work.</p>
  
  <p>HTML</p>
  
  <pre><code>    &lt;section&gt;
      &lt;form enctype="multipart/form-data" id="frmemail"&gt;
          &lt;fieldset class="margin-b"&gt;
              &lt;legend&gt;Contact Me&lt;/legend&gt;
              &lt;label for="form_name"&gt;Name:&lt;input name="form_name" type="text" value="" required autofocus &gt;&lt;/label&gt;
              &lt;label for="form_email"&gt;Email:&lt;input type="email" name="form_email" value=""&gt;&lt;/label&gt;
              &lt;label for="form_msg"&gt;Message:&lt;textarea name="form_msg" rows="5"&gt;&lt;/textarea&gt;&lt;/label&gt;
          &lt;/fieldset&gt;
          &lt;input type="submit" name="submit" id="submit" value="Submit"&gt;
      &lt;/form&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>$.ajax({
    type: "POST",
    url: "email-php.php",
    data: $("#frmemail").serialize(),
    success: function(){
      $('.success').fadeIn(1000);
    }
  });
  </code></pre>
  
  <p>PHP</p>
  
  <pre><code>&lt;?php
  if(isset($_POST['name'],$_POST['email'],$_POST['message'])){
    $name = $_POST['form_name'];
    $email = $_POST['form_email'];
    $message = $_POST['form_msg'];
  
    //send email
    mail("landon@thecallfamily.com", "From: " .$email, $message);
  }
  ?&gt;
  </code></pre>
  
  <p>Final Working Code</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;section&gt;
    &lt;form enctype="multipart/form-data" id="frmemail"&gt;
      &lt;fieldset class="margin-b"&gt;
        &lt;legend&gt;Contact Me&lt;/legend&gt;
        &lt;label for="form_name"&gt;Name:&lt;input name="form_name" type="text" value="" required autofocus &gt;&lt;/label&gt;
        &lt;label for="form_email"&gt;Email:&lt;input name="form_email" type="email" value=""&gt;&lt;/label&gt;
        &lt;label for="form_msg"&gt;Message:&lt;textarea name="form_msg" rows="5"&gt;&lt;/textarea&gt;&lt;/label&gt;
      &lt;/fieldset&gt;
      &lt;input type="submit" name="submit" id="submit" value="Submit"&gt;
    &lt;/form&gt;
  &lt;/section&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>$(document).ready(function() {
    $('#frmemail').submit(function(event) {
      $.ajax({
        type: 'POST',
        url: 'email-php.php',
        data: $('#frmemail').serialize(),
        success: function() {
          $('.success').fadeIn(1000)
        }
      })
    })
  })
  </code></pre>
  
  <p>PHP</p>
  
  <pre><code>&lt;?php
  $name = $_POST['form_name'];
  $email = $_POST['form_email'];
  $message = $_POST['form_msg'];
  
  $to = "landon@thecallfamily.com";
  $subject = "RIA Emails";
  $body = "Name: ".$name."\nEmail: ".$email."\nMessage: ".$message;
  $headers = "From: " . $email;
  
  //send email
  mail($to, $subject, $body, $headers);
  ?&gt;
  </code></pre>