jQuery/PHP mail send the easy way?

Question

Ok, to make long story short:

JavaScript:

jQuery("submit").click(function() { 

    var address = jQuery("#mail").val();
    var title = jQuery("#title").val(); 
    var name = jQuery("#name").val(); 
    var mail = jQuery("#email").val();  
    var message = jQuery("#msg").val(); 

    alert(address);
    alert(title); 
    alert(name); 
    alert(mail); 
    alert(message); 

    jQuery.post("sendmail.php",
    {address: address, title: title, name: name, mail: mail , message: message}, 
    function(data){
        jQuery("#email").html("<div id='sent'><p>Thank you for the message.</p><p>We will reply as soon as possible.</p></div>");
        alert('sent');
    });      

return false;       
});  

Works smoothly (shows every value in alert), but never shows div "sent". And never sends an actual mail.

sendmail.php is in the right place, and it's code is:

<?php

// getting variables from form

$emailTo = trim($_REQUEST['address']);
$subject = trim($_REQUEST['title']);;
$name = trim($_REQUEST['name']);
$emailFrom = trim($_REQUEST['mail']);
$message = $_REQUEST['message'];

// prepare email body text

$Body = "You have a message from: ";
$Body .= $name;
$Body .= "\n";
$Body .= "\n";
$Body .= $message;

// send prepared message

$sent = mail($emailTo, $subject, $Body);

//callback for jQuery AJAX

if ($sent){
  echo 'sent';
}
else{}

print_r($_REQUEST); die();
?>

Updated jQuery code, also doesn't work:

jQuery("#contact-form-send").click(function() {    

    var address = jQuery("#contact-form-mail-address").val();
    var title = jQuery("#contact-form-mail-title").val(); 
    var name = jQuery("#contact-form-name").val(); 
    var mail = jQuery("#contact-form-email").val();  
    var message = jQuery("#contact-form-message").val(); 

    var data = "&address=" + address + "&title=" + title + "&name=" + name + "&mail=" + mail + "&message=" + message;

    jQuery.ajax({
     type: "POST",
     url: "sendmail.php",
     data: data,
     success: function(){
          jQuery(".email-us").html("<div id='email-sent'><p>Thank you for the message.</p><p>We will reply as soon as possible.</p></div>");     
     }
});   

return false;       
});  

Solution

You should use Ajax. Its a lot easier. ~~Here is a simple tutorial here on sending mail using PHP, Ajax, & jQuery:~~

[Send mail using PHP, Ajax and jQuery]

Edit: the link is no more available

it would look something similar to this:

var data = "address=" + address + "&title=" + title + "&name=" + name + "&mail=" + mail + "&message=" + message;
//or however u want to format your data

$.ajax({
     type: "POST",
     url: "sendmail.php",
     data: data,
     success: function(phpReturnResult){
          alert('Success: ' + phpReturnResult);
          jQuery(".email-us").html("<div id='email-sent'><p>Thank you for the message.</p><p>We will reply as soon as possible. PHP Script's return result: " + phpReturnResult + "</p></div>");     
     },
     error: function(errormessage) {
           //you would not show the real error to the user - this is just to see if everything is working
          alert('Sendmail failed possibly php script: ' + errormessage);
     }
});

Also in your PHP file, you seem to used the mail function twice.

Comments

[anonymous]

Af! The problem is "success" NEVER occurs! I've NEVER seen a div called "email-sent" and the "Thank you for the..." text :( That's the point. Everything works fine, all data is grabbed, the link is created, the sendmail.php file is in the right place (to be honest I've even copied it almost everywhere) and nothing!

[KJYe.Name]

@anonymous attach this error function and see if it displays. if it displays it's probably your php script that has issue. however if it does, then that means the ajax was success

[KJYe.Name]

@anonymous added alert for both success or failure so you'll know if your ajax is failing or your php script is. goodluck