带有jQuery和Ajax的POST数组

Question

I have a form with multiple fields, whereby fields can be added.

The FORM is as follows:

<form id="myForm" action="myfile.php" >
<input . . > 

<select>. . . </select>

</form>

myfile.php has the following code:

foreach ($_POST as $key => $value) {

echo $key." takes the <b>".$value."</b> Value"; 

}

This simple code processes all the entries of the form regardless how many.

Now, what I want is:

When I click on the submit button, instead of sending the form's content to a script, to actually get that array and pass it AJAX without having to write every single key and its value manually.

I hope it makes sense

Answer 1

I think what you are looking for is serialize()

jQuery(function ($) {
    //submit handler
    $('#myForm').submit(function (e) {
        //prevent default submit
        e.preventDefault();

        $.ajax({
            url: $(this).attr('action'),
            type: 'POST',
            data: $(this).serialize(),
            ....
        })
    });
})

Answer 2

You can use jQuery serialize() method

$("#myForm").submit(function(e){ //To listen submit event
    e.preventDefault(); //To prevent default browser action
    var data=$(this).serialize(); // To get form data
    $.post($(this).attr('action'),data,function(data){ //To perform post
         $('#result').html(data); //Result data
    });
});