How do i know what values have been changed in the table in jquery

Question

I have a Html Table which consists of rows that were generated dynamically (from PHP) and each row conatins the select box and textbox with the values. Now how do i know which row has been changed (i mean Select box and textbox). Iam looking to have a list of (1,3,5,7) rows that have been changed so that i can pass them to the hidden and retrive in php

 ("#tb11").change(function(){
  //Code 

 });

Answer 1

You can monitor object for changes. Give the input's (I'm assuming they are inputs) a class of monitor and run

$(".monitor").bind("keyup", function(event){ /* Code */ });

Answer 2

try this code:

$("#tb11 input").change(function(){
      // Gets the parent row of the item that has been changed and adds a class of changed
      $(this).parent().parent().addclass('changed'); 
});

You will need to give each row a unique id number, and use the following code to handle the submission:

function submitForm() {
    $('.changed').each(function () {
        // Will loop through each row that has been changed and post a value based on the id attribute
        var rowId = $(this).attr('id');
        // post the value of your row id to php
        $.post('myurl.php?rowId='+rowId, function(data) {
            //callback method for succesfull post
        });
    }
}

Answer 3

That will give you the index of the row, which has been changed

(function() {
  $("table").change(function(e) {
    alert($(e.target).closest("tr").index());
  });
})();​