jQuery.ajax - submit all elements in form without manually entering them

Question

Hi.

I would like to use jQuery.ajax to submit a form using POST without having to specify everything manually in the "data: " part.

This is what I don't want:

data:   "username=" + document.getElementById("username").value + 
    "&email=" + document.getElementById("email").value,

Is there a way to just have it include alla elements with their values from an entire FORM field? This form is generated dynamically so it would save me a lot of time!

Answer 1

Use serialize method.

data :   $("form").serialize()

Answer 2

Look at http://docs.jquery.com/Ajax/serialize.

That would make the following example:

$("#submit").click(function() {
    $.ajax({
     data: $("form").serialize(),
     ...rest
    });
});

Answer 3

You may consider using JQuery Form Plugin.