Execute jQuery script after submitting a form - php

Question

I want to execute a jQuery script after submitting a form. The jQuery script it's only a line that will fade In a hidden that will show if the e-mail have been sent or not sent.
The PHP code is at the top of the file and I don't know if staying the PHP code at the top is the problem but I tried moving de PHP above the jquery script but it doesn't work.
EDIT:
Now I have that code in my index.php
$(document).ready(function) {
$('form').submit(function) {
$.ajax({
url: "mail.php",
type: "POST",
data: {
name: $('input[name="name"]').val(),
email: $('input[name="email"]').val(),
msg: $('input[name="msg"]').val()
},
cache: false,
success: function(response) {
$('#result').html(response);
}
});
return false;
});
});
In mail.php I have that other code
$name = $_POST['name'];
$mail = $_POST['email'];
$msg = $_POST['msg'];
if(mail('test#test.com', $name, $msg)) {
echo 'Pass!';
} else {
echo 'Fail!';
}
When I executed it nothing happens and the URL shows the data that I wrote in the inputs but any message appears.

Answer 1

Here's a simple example for processing a form with AJAX. Notice the IDs: #emailForm is the ID of the form, and #out is the ID of some HTML element (such as a div or p) where you want to display the result. The function email.php is your server side script to send the email and return the result.
$(document).ready(function() {
$('#emailForm').submit(function(){
$.ajax({
url: "email.php",
type: 'POST',
data: {
name: $('input[name="name"]').val(),
email: $('input[name="email"]').val(),
msg: $('input[name="msg"]').val()
},
cache: false,
success: function(responseText){
$('#out').html(responseText);
}
});
return false;
});
});
On the server side, email.php (or whatever you want to call it) processes the data and sends the email. The data can be retrieved from the $_POST array. After sending or attempting to send the email, email.php can simply echo the result to be inserted in the HTML element with the id of "out."
$name = $_POST['name'];
$email = $_POST['email'];
$msg = $_POST['msg'];
//PUT CODE HERE FOR SENDING EMAIL
if ($success){
echo "Email sent with success!";
} else {
echo "Unable to send your email at this time. Please try again later.";
}
The output should appear in the HTML element:
<div id="out">Email sent with success!</div>

Answer 2

you can use onSubmit attribute in form tag
e.g.
<form name="anything" id="anything" onSubmit="functionname();" >
or the other option is onClick of Submit button
<input type="submit" onClick="functionname();" value="SUBMIT FORM" />
I personally preffer 1st method