I'm trying to create a mail form which has javascript validation. The form values should be send with ajax to a php script which emails the data to an emailadress.

However, Neither the php code, succes or the error jquery callbacks gets called, nor are there any logs in the javascript console in chrome.

this is my simplified html page:

<form id="mail-form">
    <div class="input-row">
    <div class="label"><label for="name">Your name: *</label></div>
    <div class="input"><input type="text" name="name" id="name" maxlength="50"/></div>
        <input id="submit-button" type="submit" value="send"/>
</form>

my javascript:

$(document).ready(function () {
    var form = $("#mail-form");

    form.submit(function (e) {
        e.preventDefault();
        send(form);
    }
});

function send(form) {

    var formData = { name: $("#name").val(),
        email: $("#email").val(),
        phone: $("#phone").val(),
        message: $("#message").val(),
    };

    $.ajax({
        type: "POST",
        url: "/scripts/mailer.php",
        datatype: "text",
        data: formData,
        succes: function (data) {
            onSucces();
        },
        error: function () {
            onError();
        }
    });
}

and my simplified php file:

$myemail = "[email protected]";
$subject = "test";

$message = $_POST["message"];

mail($myemail, $subject, $message);

echo "ok";

Can someone point out what I'm doing wrong? I also tried easy get methods, but they won't reach the server either.

try it like this:

change:

$(document).ready(function () {
    var form = $("#mail-form");

    form.submit(function () {
        e.preventDefault();
        send(form);
        }
    });
});

$("#mail-form").submit(function (e) {
        e.preventDefault();
        send(form);
});

so it looks like this:

$("#mail-form").submit(function (e) {
        e.preventDefault();
        send(form);
});

function send(form) {

    var formData = { name: $("#name").val(),
        email: $("#email").val(),
        phone: $("#phone").val(),
        message: $("#message").val(),
    };

    $.ajax({
        type: "POST",
        url: "/scripts/mailer.php",
        datatype: "text",
        data: formData,
        success: function (data) {
            onSucces();
        },
        error: function () {
            onError();
        }
    });
}