SO I have a basic contact form using bootstrap. I am trying to email the contents of the form and the email isn't sending. The form is being validated and success message displayed but the email isnt sending. Any help would be appreciated. I know there are similar posts about php mail forms, but I think my problem is in the ajax post. Everything seems to be ok in the PHP script.
The Markup:
<h4>Contact Form</h4>
<div id="success"> </div> <!-- For success/fail messages -->
<form id="sentMessage" class="well" id="contactForm" novalidate="">
<div class="control-group">
<div class="controls">
<input type="text" class="form-control" placeholder="Full Name" id="name" required data-validation-required-message="Please enter your name" />
<p class="help-block"></p>
</div>
</div>
<div class="control-group">
<div class="controls">
<input type="email" class="form-control" placeholder="Email" id="email" required data-validation-required-message="Please enter your email" />
</div>
</div>
<div class="control-group">
<div class="controls">
<input type="text" class="form-control" placeholder="Phone" id="phone" required data-validation-required-message="Please enter your phone" />
</div>
</div>
<div class="control-group">
<div class="controls">
<textarea rows="10" cols="100" class="form-control" placeholder="Message" id="message" required data-validation-required-message="Please enter your message" minlength="5" data-validation-minlength-message="Min 5 characters" maxlength="999" style="resize:none"></textarea>
</div>
</div>
<button type="submit" class="btn btn-primary pull-right" id="submit">Send</button><br />
</form>
I am using ajax to grab the data from the inputs and post to a PHP file
$(function() {
$("input,textarea").jqBootstrapValidation(
{
preventSubmit: true,
submitError: function($form, event, errors) {
},
submitSuccess: function($form, event) {
event.preventDefault();
var name = $("input#name").val();
var email = $("input#email").val();
var phone = $("input#phone").val();
var message = $("textarea#message").val();
var firstName = name;
if (firstName.indexOf(' ') >= 0) {
firstName = name.split(' ').slice(0, -1).join(' ');
}
$.ajax({
url: "bin/contact_me.php",
type: "POST",
data: {name: name, phone: phone, email: email, message: message},
cache: false,
success: function() {
$('#success').html("<div class='alert alert-success'>");
$('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×")
.append( "</button>");
$('#success > .alert-success')
.append("<strong>Your message has been sent. </strong>");
$('#success > .alert-success')
.append('</div>');
$('#contactForm').trigger("reset");
},
error: function() {
$('#success').html("<div class='alert alert-danger'>");
$('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×")
.append( "</button>");
$('#success > .alert-danger').append("<strong>Sorry "+firstName+" it seems that my mail server is not responding...</strong> Sorry for the inconvenience!");
$('#success > .alert-danger').append('</div>');
$('#contactForm').trigger("reset");
},
})
},
filter: function() {
return $(this).is(":visible");
},
});
$("a[data-toggle=\"tab\"]").click(function(e) {
e.preventDefault();
$(this).tab("show");
});
});
$('#name').focus(function() {
$('#success').html('');
});
And then I am using PHP to send an email.
<?php
// check if fields passed are empty
if(empty($_POST['name']) ||
empty($_POST['phone']) ||
empty($_POST['email']) ||
empty($_POST['message']) ||
!filter_var($_POST['email'],FILTER_VALIDATE_EMAIL))
{
echo "No arguments Provided!";
return false;
}
$name = $_POST['name'];
$phone = $_POST['phone'];
$email_address = $_POST['email'];
$message = $_POST['message'];
// create email body and send it
$to = 'myemail@somedomain.com'; // put your email
$email_subject = "Contact form submitted by: $name";
$email_body = "You have received a new message. \n\n".
" Here are the details:\n \nName: $name \n ".
"Email: $email_address\n Phone: \n $phone \n Message: \n $message";
$headers = "From: myemail@somedomain.com\n";
mail($to,$email_subject,$email_body,$headers);
return true;
?>
Thank you in advance.