Jquery and multiple forms on a page

Question

I have a several forms that are output from a database on the same page. It works fine when I don\'t use ajax. When I use Jquery it will only work for the first form. Could

Answer 1

All the forms and the fields have the same name / class. So when you do

var hardSoft = $('.hardSoft').val();

you only get the value of the first element with class hardSoft.

---

You can get the "parent" form element with .closest() and use .serialize() to create the data string:

$('.updateSubmit').live('click', function() {

    var $form = $(this).closest('form'); // get the form element this button belongs to
    var theData = $form.serialize(); // generates the data string

    $.ajax ({
       type: 'POST',
       url: '/updateGrab.php',
       data: theData,
       success: function(aaa) {
         // append return data to the current form
         $form.append('
'+aaa+'
');
       } // end success
    }); // end ajax
    return false;
)};