Contact form returning blank email

Question

My Foundation 5 contact form is returning blank emails for some reason. The javascript is correct but I can't see anything wrong with my PHP file. What am I doing wrong? Here's the PHP:

<?php
$name = $_POST["t_name"];
$email = $_POST["t_email"];
$message = $_POST["t_message"];

$msg = "
Name: $name
Email: $email
Commments:
$message
";
$to = "me@me.com";
$subject = "From My Site";
$message = $msg;
mail($to,$subject,$message,$headers);
?>

the HTML:

<div id="contactForm" class="large-6 large-offset-6 columns">
                            <form id="t-contact-form" method="post" data-abide="ajax">
                                <small class="error">Your full name is required.</small>
                                <input name="t_name" id="t_name"  type="text" placeholder="Full Name" required>
                                <small class="error">An email address is required.</small>
                                <input name="t_email" id="d_email" type="email" placeholder="username@address.com" required>
                                <small class="error">Your message is required.</small>
                                <textarea name="t_message" id="d_message" placeholder="Enter your message here" required></textarea>
                                <button class="contact-submit submit">Submit</button>
                                </a>
                            </form>
                        </div>

and the js:

$('#t-contact-form').on('valid.fndtn.abide', function() {
        var t_name = $("input#t_name").val();
        var t_email = $("input#t_email").val();
        var t_message = $("textarea#t_message").val();
        // Data for response
        var dataString = 'name=' + t_name + 
            '&email=' + t_email + 
            '&message=' + t_message;
        //Begin Ajax Call
        $.ajax({
                type: "POST",
                url: "assets/php/t-mail.php",
                data: dataString,
                success: function() {
                    $('#t-contact-form').html("<div id='success'></div>");
                    $('#success').html("<h2>Thanks!</h2>")
                            .append("<p>Dear" + t_name + "!, I look forward to working with you.</p>")
                            .hide()
                            .fadeIn(1500);
                            },
        }); //ajax call
        return false;
});

Answer 1

The AJAX call sending using name and not t_name, same for email and message. How it was originally named in the HTML doesn't matter to PHP, only the posted data matters.

var dataString = 'name=' + t_name + 
        '&email=' + t_email + 
        '&message=' + t_message;

So in PHP you should do

<?php
$name = $_POST["name"];
$email = $_POST["email"];
$message = $_POST["message"];

---

Additionally you're getting the inputs by id, but using the names in the JavaScript. Either rename them to t_email and t_message in the HTML or modify the JavaScript.

<input name="t_email" id="t_email" type="email" placeholder="username@address.com" required>
<textarea name="t_message" id="t_message" placeholder="Enter your message here" required></textarea>