jQuery AJAX

Send AJAX requests with this jQuery script.

HTML

<script src="http://fonts.googlepis.com/css?famaily=Open+Sans:400,700"></script>
<form method="post" action="/echo/html/" ajax="true"> <span id="result"><a href="http://wp.me/p2O9K2-b">jQuery + AJAX form submit script.</a></span>
 <span>        
        <label>Message: </label>
        <input type="text" name="html" placeholder="Howdy..." />
    </span>
 <span>
        <label><img id="loadingimg" src="http://dev.cloudcell.co.uk/bin/loading.gif"/>   </label>
        <input type="submit" value="Submit" />      
    </span>

</form>

CSS

body {
    font-family:'Open Sans', 'Helvetica Neue', 'Arial', sans-serif;
    font-size: 13px;
}
form span {
    display: block;
    margin: 10px;
}
label {
    display: inline-block;
    width: 100px;
}
input[type="text"] {
    border: 1px soild #ccc;
    width: 200px;
    padding: 5px;
}
input[type="submit"] {
    padding: 5px 15px;
}
span#result {
    padding: 5px;
    background: #ff9;
}
img#loadingimg {
    display: none;
}

JavaScript

function minhaCallBack(returnhtml) {
    $("#result").html(returnhtml);
    $("#loadingimg").hide();
}

$(document).ready(function (e) {

    $("form[ajax=true]").submit(function (e) {

        e.preventDefault();

        var form_data = $(this).serialize();
        var form_url = $(this).attr("action");
        var form_method = $(this).attr("method").toUpperCase();

        $("#loadingimg").show();

        $.ajax({
            url: form_url,
            type: form_method,
            data: form_data,
            cache: false,
            success: minhaCallBack
        });

    });

});