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;       
});

@kjy112, sure, I'm working on it of course :) I've totally updated the first post, maybe you will be able to find the problem? But firstly I'm going to check your method with .ajax. — anonymous, Feb 19 '11 at 20:39
you have closed your else statement w/o putting anything in it...perhaps the `print_r($_REQUEST);` ? — KJYe.Name, Feb 19 '11 at 20:47
@kjy112, changes nothing, by the way I have no access to sendmail.php output, I'm just clicking "submit" and there's div appearing. Nothing more. There's no redirect to sendmail.php. — anonymous, Feb 19 '11 at 21:37
Sounds like it works. Its doing ajax which doesn't redirect but submits on request. So its as if you never leave the page but yet the mail is send if your sendmail.php is correct. basically what you want to do is attach the callback information to the `jQuery(".email-us".html();` i am going to update my answer again to show u — KJYe.Name, Feb 19 '11 at 21:38
@kjy112 it's probably not working since I'm getting no mails... ;/ But I'm doing it on localhost, I'll try to check on the server somewhere else. Anyways Id love to attach callback info to the right line, but I'm not sure how to. — anonymous, Feb 19 '11 at 21:43
@anonymous check out my edited answer. it has attached phpreturnresult which is what you echo at the end. — KJYe.Name, Feb 19 '11 at 21:44

score 5 · Answer 1 · edited May 20 '21 at 13:13

5

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.

edited May 20 '21 at 13:13

gael

1,314
2
12
20

answered Feb 19 '11 at 16:20

KJYe.Name

16,969
5
48
63

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! – anonymous Feb 19 '11 at 21:56
@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 Feb 19 '11 at 22:09
@anonymous added alert for both success or failure so you'll know if your ajax is failing or your php script is. goodluck – KJYe.Name Feb 19 '11 at 22:37

jQuery/PHP mail send the easy way?

1 Answers1

Linked