Obtain form input fields using jQuery?

Question

I have a form with many input fields.

When I catch the submit form event with jQuery, is it possible to get all the input fields of that form in an associative array?

Answer 1

$('#myForm').submit(function() {     // get all the inputs into an array.     var $inputs = $('#myForm :input');      // not sure if you wanted this, but I thought I'd add it.     // get an associative array of just the values.     var values = {};     $inputs.each(function() {         values[this.name] = $(this).val();     });  }); 

---

Thanks to the tip from Simon_Weaver, here is another way you could do it, using serializeArray:

var values = {}; $.each($('#myForm').serializeArray(), function(i, field) {     values[field.name] = field.value; }); 

Note that this snippet will fail on <select multiple> elements.

It appears that the new HTML 5 form inputs don't work with serializeArray in jQuery version 1.3. This works in version 1.4+

Answer 2

Late to the party on this question, but this is even easier:

$('#myForm').submit(function() {     // Get all the forms elements and their values in one step     var values = $(this).serialize();  });