Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
517 views
in Technique[技术] by (71.8m points)

ajax - jQuery - Send a form asynchronously

I have a form such as :

<form action='???' method='post' name='contact'>
        <input type="text" class="inputContact" name="mittente" />
        <textarea class="textContact" name="smex"></textarea>
        <input type="submit" value="Send" />
    </div>
</form> 

I'd like to send these data asynchronously, trought jQuery function $.ajax.

EDIT :with solution :

<form name='contactForm'>
    <input type="text" class="inputContact" name="mittente" />
    <textarea class="textContact" name="smex"></textarea>
    <input type="submit" value="Send" />
</form> 

<script type="text/javascript">
$(document).ready(function() {
    $('form[name=contactForm]').submit(function(e){
        e.preventDefault();
        $.ajax({
            type: 'POST',
            cache: false,
            url: './ajax/header_ajax.php',
            data: 'id=header_contact_send&'+$(this).serialize(), 
            success: function(msg) {
                $("#boxContentId").html(msg);
            }
        });
    });     
});         
</script>
See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)
$('form[name=contact]').submit(function(){

    // Maybe show a loading indicator...

    $.post($(this).attr('action'), $(this).serialize(), function(res){
        // Do something with the response `res`
        console.log(res);
        // Don't forget to hide the loading indicator!
    });

    return false; // prevent default action

});

See:


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...