Question

jQuery:

$("#contact-us-form").submit(function () {
    var nameVal = $("input[name=name]").val();
    var companyVal = $("input[name=company]").val();
    var titleVal = $("input[name=title]").val();
    var emailVal = $("input[name=email]").val();
    var phoneVal = $("input[name=phone]").val();
    var messageVal = $("input[name=message]").val();
    $.post("mailer.php", {
        name: nameVal,
        company: companyVal,
        title: titleVal,
        email: emailVal,
        phone: phoneVal,
        message: messageVal
    }, function (data) {
        alert("Data Loaded: " + data);
        $('#thanks').show();
    });
    return false;
});

mailer.php:

<?php

if(isset($_POST['submit'])) {

    $to = "[e-mail]";
    $subject = "Inquiry";
    $name = $_POST['name'];
    $company = $_POST['company'];
    $title = $_POST['title'];
    $email = $_POST['email'];
    $phone = $_POST['phone'];
    $message = $_POST['message'];

    $body = <<<HEREDOC
        From: $name
        Company: $company
        Title: $title 
        E-Mail: $email
        Phone: $phone \n
        Message: $message 
HEREDOC;

    echo 'success';
    mail($to, $subject, $body);

} else {
    echo "failure";
}

?>

The data alert on the page returns failure, I don’t understand why!

Thanks for your help!

Answer 1

Two things, first the main issue is there is no submit variable you’re passing (if there’s a submit button it is not serialized like it would be in a normal post), so you have to add it. Also, you can really shorten you code by using .serialize() to serialize the <form> here, like this:

$("#contact-us-form").submit(function () {
  $.post("mailer.php", $(this).serialize(), function (data) {
    alert("Data Loaded: " + data);
    $('#thanks').show();
  });
  return false;
});

To add your submit variable in there just use .serializeArray() and add it in, do this:

$("#contact-us-form").submit(function () {
  var fdata = $(this).serializeArray();
  fdata.push({ name: 'submit', value: true });
  $.post("mailer.php", fdata, function (data) {
    alert("Data Loaded: " + data);
    $('#thanks').show();
  });
  return false;
});