Question

I have a page that contains several forms that are identical throughout a page. I submit these forms using the $.ajax() method.

As I see it using classes to identify/submit/validate the individual forms will likely be problematic. Passing the form with something like $('.someForms').serialize() would not produce viable results. How would .serialize() select the proper form??

Even if .serialize() would work, I’m not sure how to go about applying any form validation suggestions to specific fields…

The other option I see is to code for each form.

Ex: $('#thisForm').serialize();

I’m curious how you jQuery guru’s handle multiple forms like this?

Answer 1

There are many ways to select forms. You could select them by their index:

$("form:eq(0)").serialize(); // serialize first form on page
$("form:eq(3)").serialize(); // serialize fourth form on page

You could select them by first going through a unique child of theirs:

$(":input[name='uniqueChild']").closest("form").serialize(); // serialize holder

You could select them by channeling through a unique parent of theirs:

$("#userDetails form").serialize(); // serialize form within DIV#userDetails

While there are many other ways to access forms specifically, I must say that if you find yourself needing to use any of these aforementioned methods, you probably need to rethink your code a bit.