Question

Assuming I have the following table:

<table>
  <thead>
    <tr>
      <th>Column 1</th>
      <th>Column 2</th>
      <th>Column 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>A1</td>
      <td><input type="checkbox"/> A2</td>
      <td>A3</td>
    </tr>
    <tr>
      <td>B1</td>
      <td><input type="checkbox"/> B2</td>
      <td>B3</td>
    </tr>
    <tr>
      <td>C1</td>
      <td><input type="checkbox"/> C2</td>
      <td>C3</td>
    </tr>
  </tbody>
</table>

I want to generate JSON from the table only for the rows whose checkbox is checked. What do I put in for “Insert Check Here”?

var myRows = [];
var $headers = $("th");
var $rows = $("tbody tr").each(function(index) {
  $cells = $(this).find("td");
  myRows[index] = {};
  $cells.each(function(cellIndex) {
    // Insert Check Here
    myRows[index][$($headers[cellIndex]).html()] = $(this).html();
  });    
});

var myObj = {};
myObj.myrows = myRows;
alert(JSON.stringify(myObj));​

Answer 1

I’ve added an If statement to test if the TD contains a checkbox which is checked or not, see the comment in the code

// Loop through grabbing everything
    var myRows = [];
    var $headers = $("th");
    var $rows = $("tbody tr").each(function(index) {
      $cells = $(this).find("td");
      myRows[index] = {};
      $cells.each(function(cellIndex) {
         if($(this).find('checkbox').is(':checked')) //Find the checkbox within the TD and test if it's checked or not
         {
           myRows[index][$($headers[cellIndex]).html()] = $(this).html();
         }
      });    
    });

// Let's put this in the object like you want and convert to JSON (Note: jQuery will also do this for you on the Ajax request)
var myObj = {};
myObj.myrows = myRows;
alert(JSON.stringify(myObj));​