Php-Formular ajax "Erfolg & fail" - Meldung

Das Formular auf meiner Webseite ist ein einfaches Kontaktformular.
Ich würde gerne das Formular, um einen "Erfolg & failed" Meldung auf der gleichen Seite, wenn das Formular gesendet/fehlgeschlagen, ohne die Seite neu zu laden. Ich verstehe, dass ich Ajax verwenden, um dies zu tun, aber ich kann nicht ankommen es zu wirken, denn mein wissen darüber ist sehr wenig.

Hier ist der code mit dem ich arbeite.

Html (einzelne Seite, design):

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>

<form class="form" id="contactus" action="" method="post" accept-charset="UTF-8">




                        <label for="nametag">Namn<FONT COLOR="#FF0060">*</FONT></label>

                        <input name="name" type="text" id="name"  value="" />




                        <label for="emailtag">Email<FONT COLOR="#FF0060">*</FONT></label>

                        <input name="email" type="text" id="email"  value="" />


                        <label for="phonetag">Telefon</label>

                        <input name="phone" type="text" id="phone"  value="" />


                        <label for="messagetag">Meddelande<FONT COLOR="#FF0060">*</FONT></label></br>

                        <textarea name="message" id="message" style="width: 87%; height: 200px;"></textarea>






<label class="placeholder">&nbsp;</label>

                        <button class="submit" name="submit">Skicka</button>



                </form> 



<script>        
    $(function() {
            $('#contactus').submit(function (event) {
                event.preventDefault();
                event.returnValue = false;
                $.ajax({
                    type: 'POST',
                    url: 'php/mail.php',
                    data: $('#contactus').serialize(),
                    success: function(res) {alert(res);
                        if (res == 'successful') {
                            $('#status').html('Sent').slideDown();
                        }
                        else {
                            $('#status').html('Failed').slideDown();
                        } 
                    },
                    error: function () {
                        $('#status').html('Failed').slideDown();
                    }
                });
            });
        });
    </script>   

Php:

<?php
    $name = $_POST['name'];
    $email = $_POST['email'];
    $phone = $_POST['phone'];
    $message = $_POST['message'];
    $recipient = "[email protected]";
    $subject = "Webbkontakt";
    $formcontent = "Från: $name <br/> Email: $email <br/> Telefon: $phone <br/> Meddelande: $message";

    $headers = "From: " ."CAMAXON<[email protected]>" . "\r\n";
    $headers .= "Reply-To: ". "[email protected]" . "\r\n";
    $headers .= "MIME-Version: 1.0\r\n";
    $headers .= "Content-Type: text/html; charset=utf-8\r\n";

    if(mail($recipient, $subject, $formcontent, $headers))
    {
        echo "successful";
    }
    else
    {
        echo "error";
    }
?>

InformationsquelleAutor user2566091 | 2013-07-11