Submit form to php using jquery

Question

I had a contact form that submitted to a php page with this content:

<?php 
$to = 'emailtosendto';
$subject = 'New message from contact form';
$name = $_POST['fullname'];
$mail = $_POST['email'];
$company = $_POST['company']; 
$phone = $_POST['phone']; 
$comment = $_POST['comment'];
$message = $_POST['message'];   
$body = 'Mr/Mrs '.$name.' wishes to contact us.
He\'s from a company called '.$company.'.
You can email him back at '.$mail.', or call him on '.$phone.'.
He was sneaky and found us through '.$comment.'.
He would like to say,
'.$message.'';
ini_set('sendmail_from', '$mail');
mail($to, $subject, $body);
header('location:./?sent');
?>

I have now changed the form to a nice live validated jQuery form, you can see the fiddle of it below.

http://jsfiddle.net/swift29/6UC7m/

I was wodering how I could change any of this code to still do the same function but make it so a popup appears confirming the message has been sent using jQuery then for it to fade back out and the form have been reset

Thanks in advance, Swift

Please escape your mail inputs: stackoverflow.com/questions/8071916/… — Dunhamzzz
– Dunhamzzz, Commented Aug 31, 2012 at 13:28
to follow up on Sam's comment, One word that will solve your problem: "Ajax" — Gonçalo Vieira
– Gonçalo Vieira, Commented Aug 31, 2012 at 13:32

Richard de Wit · Accepted Answer · 2012-08-31 13:35:49Z

1

Instead of submitting, you can use AJAX. That way you can get a popup when its done.

Example:

$.ajax(
    url:  "urlofscript.php",
    data: {
              fullname: variableContainingFullname, // i.e. var variableContainingFullname = $("#fullname").var();
              email:    variableContainingEmail,
              // etc, all the php variables in POST
          },
    type: "POST",
    success: function(result)
    { 
        alert("DONE"); 
    }

answered Aug 31, 2012 at 13:35

Richard de Wit

7,5107 gold badges48 silver badges59 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Thomas Clayson · Accepted Answer · 2012-08-31 13:34:08Z

You're looking for jQuery's ajax() function.

AJAX will send POST queries through Javascript. This will mean that you won't have to refresh the page, it will get sent automatically and the script (mailer.php) will be called in a new instance (not the browser window that the user is currently using) - its also called "asynchronous" or "background" i.e. it doesn't interrupt what the user is doing (in a nutshell).

AJAX is pretty easy to get your head around, basically its like javascript is sending a form itself, rather than the user doing it.

In the ajax() jquery function there are some callback functions.

The one you want is called success: and it can look like this:

success: function(data){ alert("Your message has been sent!"); }

That will display an alert when the php script is run and the javascript calls back.

Hth

Collectives™ on Stack Overflow

Submit form to php using jquery

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related