Question

I want post a form with jquery, but my code not work. after I submit it, my page will refresh, where is the problem? wait for a help.

jquery code

function submitForm() {
        var par1 = $('input[@name=my_radio][@checked]').val();
        var par2 = $('input[@name=title]').val();
        var par3 = $('input[@name=content]').val();
            $.ajax({
                url: "r8.php", 
                dataType: "html",
                type: 'POST', 
                data: "submit=" + par1 + "&title=" + par2 + "&content=" + par3, 
                success: function(data){ 
                    $("#response").html(data);
                    $('input[@name=title]').html('');
                    $('input[@name=content]').html('');
                }
            });

        return false;
    } 

html code:

<form method="post" id="post_form" name="post_form" onsubmit="return submitForm();">
    <label>1: <input type="radio" name="my_radio" value="1" checked /></label>   
    <label>2: <input type="radio" name="my_radio" value="2" /></label> 
    <input id="title" name="title" type="text">
    <input id="content" name="content" type="text">
    <input type="submit" name="my_submit" id="my_submit" value="submit" />
</form>
<div id="response"></div>

and r8.php code

<?php
if($_POST['submit']!=''){ 

    echo $_POST['title']."|".$_POST['content']."|".$_POST['submit']."|".time(); 

}
?>

Answer 1

in your java script submitform() function, recieve values like this:

var par1 = $('input:radio[name=my_radio]:checked').val()
var par2 = $('#title').val();
var par3 = $('#content').val();

your method is not getting the values in the variables. thats why nothing is being posted.
I’ve tried it and it works.

EDIT:

What you would need to do is use one of the ajax methods to post your form, and inject the output into an element within the success callback. For example:

$("#my_submit").click(function() {
    $.post($("#post_form").attr("action"), $("#post_form").serialize(), function(html) {
        $("div.post_form").html(html);
    });
    return false; // prevent normal submit
});

Take a look at

http://api.jquery.com/jQuery.post/
and
http://api.jquery.com/jQuery.ajax/

give r8.php in your form action attribute. i.e.

<form method="post" id="post_form" name="post_form" action="r8.php" />

Hope this helps.