Contact form: AJAX and jQuery animation and coding structure - php

Question

I'm having this problem. Look at this: http://santz.net/index.contacto.html
Try sending whatever and see what happens (it's mine, I recieve it, send whatever no problem...). (It leaves the page, shows a dialog that says thanks for contacting us... and it redirects you to the same page). I HATE THIS!!!
I'm looking fore some AJAX and jQuery code that after the message is sent, it clears the form and opens a dialog (the common one... like the typical loggin boxes) and that fades the page and that show some "x" content...
The thing is that I don't know how to do any of this things and I'm driving crazy! If you could give me the code and tell me where to put it or just give a tutorial for noobs or something like that it would be great...
I leave here the PHP code I'm using:
<?php
$field_name = $_POST['php_name'];
$field_email = $_POST['php_email'];
$field_phone = $_POST['php_phone'];
$field_message = $_POST['php_message'];
$field_sender = 'alpha#hotmail.com';
$mail_to = 'gama#hotmail.com.ar';
$subject = 'Mensaje via Santz.net de '.$field_name;
$body_message = 'From: '.$field_name."\n";
$body_message .= 'E-mail: '.$field_email."\n";
$body_message .= 'Phone: '.$field_phone."\n";
$body_message .= 'Message: '.$field_message;
$headers = 'From: '.$field_sender."\r\n";
$headers .= 'Reply-To: '.$field_email."\r\n";
$mail_status = mail($mail_to, $subject, $body_message, $headers);
if ($mail_status) { ?>
<script language="javascript" type="text/javascript">
alert('Gracias por contactarse, en breve, me pondre en contacto.\n\nSantz Design | www.santz.net');
window.location = 'index.contacto.html';
</script>
<?php
}
else { ?>
<script language="javascript" type="text/javascript">
alert('El envio fallo. Por favor, envie un mail directamente a info#santz.net');
window.location = 'index.contacto.html';
</script>
<?php
}
?>

Answer 1

Try change this:
window.location.assign('http://www.santz.net/');
instead of:
window.location = 'index.contacto.html';
Showing error message on the same page, follow this example:
Add validation message in fieldset instead of js popup
And for a modal windows, use a plugin like this one:
http://www.mywebdeveloperblog.com/my-jquery-plugins/modalpoplite
Demo:
http://www.mywebdeveloperblog.com/projects/modalpoplite/demo/
saludos ;)

Answer 2

Why dont you use jQuery
$('input[type="submit"]').click(function(e){
e.preventDefault();
$.ajax({
type: "POST",
url: contact.php,
data: $('#contact-form"').serialize();,
success: function() {
//modal
}
});
});
something along those lines would be the ajax way of submitting your form and then pop up a window to the user saying thanks please view my form to get an idea just without popup