Question

With the following code, specifically the checkAll routine, I am unsure how I can go about calling my setCBCollection JavaScript function for each row that is checked/unchecked which when called from the checkAll process, print the value 123 for example.

I basically need to call my setCBCollection(cb) function for every checked row, but unsure how to go about it.

<tr>
<th id=" " class="t12subheader">
<input id="checkAll" type="checkbox">
</th>
</tr>

<tr>
  <td class="t12datavalue" align="center" style=""><input type="checkbox" value="123" name="f01"></td>
  <td class="t12datavalue" style="">123</td>
  <td class="t12datavalue" style="">333</td>
  <td class="t12datavalue" style="">Alex</td>
  <td class="t12datavalue" style="">Smith</td>
</tr>


<script language="javascript" type="text/javascript">
  $(document).ready(function() {
  $("#checkAll").click(function() {
    var self = $(this);
    if (self.attr('checked')) {
        self.closest('tr').nextAll().addClass('highlight').find(':checkbox').attr('checked', true);
    }
    else {
        self.closest('tr').nextAll().removeClass('highlight').find(':checkbox').attr('checked', false);
    }
  });

 }); 

function setCBCollection( cb ){
  alert(cb.value);
}
</script>

Answer 1

Do you mean something like:

$('tr input[type=checkbox]:checked').each(function() {
  setCBCollection($(this));
});

You can put this anywhere, example:

$("#checkAll").click(function() {
    var self = $(this);
    if (self.attr('checked')) {
        self.closest('tr').nextAll().addClass('highlight').find(':checkbox').attr('checked', true);
    }
    else {
        self.closest('tr').nextAll().removeClass('highlight').find(':checkbox').attr('checked', false);
    }
    $('tr input[type=checkbox]:checked').each(function() {
      setCBCollection($(this));
    });
  });