Jquery/Ajax Contact form not sending an email

Question

I'm sure this is a problem that's been answered many times, but I am still having problems with my contact form after spending hours trying to figure out the problem.

When I submit the form, I get re-directed to the submit.php page with the Thank you message, but no email is sent to my $email_to address.

It's probably worth noting that this code is inside a Wordpress theme and it is currently running on my local machine (will this affect anything though?)

Can anyone tell me if there is anything I'm doing wrong here? I have a feeling I'm using the plugins incorrectly, quite new to this ajax game!

I'm using the following plugins:

Jquery Form Plugin (http://pastebin.com/cC5899ns)
Jquery Validation (http://pastebin.com/GyYuVwAH)

Here's my HTML:

<div id="footer">
                <h3>Contact</h3>
                <div id="preview"></div>
                <form name="form" id="form" action="<?php bloginfo('template_directory'); ?>/_/inc/submit.php" method="post">
                    <input type="text" value="Your name" name="name" />
                    <input type="tel" value="Your contact number" name="email" />
                    <textarea name="message">Quick Note</textarea>
                    <button>Submit</button>
                </form>
            </div>

My JS:

$(document).ready(function (){

$('#form').validate(
{
rules:
{
"name":{
required:true,
maxlength:40
},
"email":{
required:true,
email:true,
maxlength:100
},
"message":{
required:true
}},

messages:
{
"name":{
required:"This field is required"
},
"email":{
required:"This field is required",
email:"Please enter a valid email address"
},
"message":{
required:"This field is required"
}},

submitHandler: function(form){
$(form).ajaxSubmit({
target: '#preview',
success: function() {
alert('hello');
$('#foooter').slideUp('fast');
}
});
}

})
});

My Submit.php

<?php
include("db.php");

if($_SERVER["REQUEST_METHOD"] == "POST")
{
    $name=mysql_real_escape_string($_POST['name']);
    $email=mysql_real_escape_string($_POST['email']);
    $message=mysql_real_escape_string($_POST['message']);
    if(strlen($name)>0 && strlen($email)>0 && strlen($message)>0)
        {
            $email_to = "*********";
            $email_from = $email;
            $email_subject = "Contact Form";
            $email_message = stripslashes($message);

            $headers = 'From: '.$email_from."\r\n" .
            'Reply-To: '.$email_from."\r\n";

            mail($email_to, $email_subject, $email_message, $headers);

            $time=time();
            mysql_query("INSERT INTO contact (name,email,message,created_date) VALUES('$name','$email','$message','$time')");
            echo "<h1>Thank You !</h1>";
        }
}
?>

My db.php

<?php
$mysql_hostname = "localhost";
$mysql_user = "root";
$mysql_password = "*****";
$mysql_database = "******";
$prefix = "";
$bd = mysql_connect($mysql_hostname, $mysql_user, $mysql_password) or die("Opps some thing went wrong");
mysql_select_db($mysql_database, $bd) or die("Opps some thing went wrong");

?>

You need to trace through step by step to see where it's going wrong - you've provided the end-to-end process but you should be able to narrow this down yourself. Is the alert('hello') showing? Use firebug or something similar to check that the request is being sent to the server - finally you need to check the saving and db code. — Aidan Kane, Apr 12 '12 at 12:23
if you are using Chrome, there is a Javascript Console(inside the `Tools` when you press the wrench button). This will know all those errors and warnings (if any). — Akhilesh B Chandran, Apr 12 '12 at 12:23
This is in no way related to your error but in $('#foooter').slideUp('fast'); "footer" is misspelled. :) — Jan, Apr 12 '12 at 12:28
Do you know if it tries to GET the page, or does it fail before? You can use Fiddler or Firebubg(Net tab) to test it — Marco Johannesen, Apr 12 '12 at 12:29
Running on your local machine definitely impacts matters. Have you specifically set up your localhost to be able to send emails? — veeTrain, Apr 12 '12 at 12:35
Okay to answer some of your questions: - Using Firebug and my poor backend knowledge, it appears to POST the submit.php successfully, but there are no other responses - I've read up on sending emails from localhost and I can imagine that this could have been the reason I was having troubles, so I have edited my php.ini file....but still no email coming through - I am not getting my contact table updated when submitting the form - My lines in each record are not over 70 characters — remi90, Apr 12 '12 at 14:04
Since you have a lot of things going on in your ajax submit form, any problem could potentially derail the submit. Does that Form plugin allow you to not specify what fields you want to send through? I would suggest you simplify. Also, not having a mail server set up would throw a php warning which could be impacting your ability to record a value in the database. Comment out everything you can and start reassuring yourself by just storing values in your database or just echoing "hello". You also have 'submit.php' and '`S`ubmit.php' in your question — veeTrain, Apr 12 '12 at 14:42

score 0 · Accepted Answer · edited May 23 '17 at 10:08

Is your contact table getting updated with a record? If so, then there are two things that I suspect would be going wrong.

1) From mail's documentation: Lines should not be larger than 70 characters.

2) Also, if your localhost has not been set up to send emails, then you should not expect to receive them.

If your contact table is getting updated then I would assume #2 is your problem.

Other stackoverflow users with this question:

Sending email from localhost

Options for mailing from localhost

Update: Definitely remove or comment out the emailing portion until you can reassure yourself that the function is working. There is a lot of leg-work required in setting up a localhost mail server so I would not worry about these portions until you can know for sure that you can send email. Attempt this process in a test file without AJAX involved. You will have plenty of warning and error messages to step through to see that mail is or is not working.

Don't try to get a feature such as email working inside AJAX until you know you can do it in a normal GET page.

Thank you for your help veeTrain - it does infact look like I still have problems sending the mail from my local host (you're right it's not exactly straight forward!). I did a test as suggested and it works on a live server but not on my local host. I'll look into this though, as I'm sure with my MAMP Pro account I should be able to change this setting... — remi90, Apr 12 '12 at 15:00
That's great to hear. Good work implementing your function correctly. — veeTrain, Apr 12 '12 at 15:04

score 0 · Answer 2 · answered Apr 12 '12 at 12:35

It does add to database correct? So the only problem is the e-mail is not being sent?

In that case your problem is that you're using localhost to send mail(), which I assume is on a Windows machine. You cannot send localhost since Windows (usually) has no mail server on localhost. You need to use an actual e-mail server for this and assign the servers address to your php.ini.

These settings:

SMTP = smtp.example.com
smtp_port = 25

More information here.

Jquery/Ajax Contact form not sending an email

2 Answers2