form not passing values to PHPMailer - php

Question

I have a responsive website built with a basic contact form. I am trying to use PHPHMailer which I have used in the past. For some reason my values from my form are not making it to the PHPMailer. I tested by placing hard coded values in "name", "email", "subject", and "message" and the form will work without problem. I tried using "isset" to make sure the was value before trying to send the mail (I did this because without the "isset" I get an "undefined index" error which tells me there are no values. This code worked fine on my basic form which was not responsive but not on this one. I am stumped. Any advice would be welcome. here is my code for both the html and the PHP. Thanks! *I have updated the code as I have narrowed the problem down to the Java Script. In the HTML the "form id="main-contact-form" is triggering the following js code
var form = $('#main-contact-form');
form.submit(function(event){
event.preventDefault();
var form_status = $('<div class="form_status"></div>');
$.ajax({
url: $(this).attr('action'),
beforeSend: function(){
form.prepend( form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn() );
}
}).done(function(data){
form_status.html('<p class="text-success">Thank you for contact us. As early as possible we will contact you</p>').delay(3000).fadeOut();
});
});
It is this js that is causing the issue. I am currently trying to figure out why on this end. Thanks for those that tried to help previously.
<form id="main-contact-form" name="contact-form" method="post" action="contact.php">
<div class="row wow fadeInUp" data-wow-duration="1000ms" data-wow-delay="300ms">
<div class="col-sm-6">
<div class="form-group">
<input type="text" name="name" class="form-control" placeholder="Name" required="required">
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<input type="email" name="email" class="form-control" placeholder="Email Address" required="required">
</div>
</div>
</div>
<div class="form-group">
<input type="text" name="subject" class="form-control" placeholder="Subject" required="required">
</div>
<div class="form-group">
<textarea name="message" id="message" class="form-control" rows="4" placeholder="Enter your message" required="required"></textarea>
</div>
<div class="form-group">
<button type="submit" class="btn-submit">Send Now</button>
</div>
</form>
And my PHP;
<?php
$email = $_REQUEST['email'];
$name = $_REQUEST['name'];
$message = $_REQUEST['message'];
$subject = $_REQUEST['subject'];
require 'PHPMailerAutoload.php';
$mail = new PHPMailer;
$mail->isSMTP();
$mail->Host = 'myhost.com';
$mail->SMTPAuth = true;
$mail->Username = 'me#myemail.com';
$mail->Password = 'mypassword';
$mail->SMTPSecure = 'tls';
$mail->From = $email;
$mail->FromName = $name;
$mail->addAddress('me#myemail.com');
$mail->addReplyTo($email);
$mail->WordWrap = 50;
$mail->isHTML(true);
$mail->Subject = $subject;
$mail->Body = $message;
if(!$mail->send()) {
echo 'Message could not be sent.';
echo 'Mailer Error: ' . $mail->ErrorInfo;
exit;
}
echo 'Message has been sent';
?>

Answer 1

Check this in your code you are missing this name in submit button
<button type="submit" class="btn-submit" name='submit'>Send Now</button>
and replace this
$email = $_POST['email'];
$name = $_POST['name'];
$message = $_POST['message'];
$subject = $_POST['subject'];
with this
$email = $_REQUEST['email'];
$name = $_REQUEST['name'];
$message = $_REQUEST['message'];
$subject = $_REQUEST['subject'];

Answer 2

For anyone else having this issue. The solution was pretty simple once I finally figured it out. The main.js template being used does not pass data and type in the ajax code. you need to add type:"POST" and data: form.serialize() to the ajax. see below.
var form = $('#main-contact-form');
form.submit(function(event){
event.preventDefault();
var form_status = $('<div class="form_status"></div>');
$.ajax({
type:"POST",//new
url: $(this).attr('action'),
data: form.serialize(), //new
beforeSend: function(){
form.prepend( form_status.html('<p><i class="fa fa-spinner fa-spin"></i> Email is sending...</p>').fadeIn() );
}
}).done(function(data){
form_status.html('<p class="text-success">Thank you for contact us. As early as possible we will contact
you').