Tuesday, September 20, 2011

Select All option using jQuery

      selecting some more checkboxes is cumbersome and tedious. usually we are trying select all or Unselect All option by checking or unchecking one. Find the snippet of jQuery to select / unselect the check boxes from a table row by changing one check box value. 

Capture

Here the code:
$(".chkAll").change(function () 
     {           
       var checkState = $(this).attr('checked');
       var row = $(this).closest('tr')   
       $(row).find('input:checkbox').attr('checked', checkState);         
});
by changing the status of first checkbox,we can select or unselect the entire row of checkboxes.

first column checkboxes has contain a class " chkAlland call the jQuery function whenever a change occurred in that checkbox. set the current status of that (chkAll) checkbox in to a variable checkstate and then find the closest table row to the checkbox. After that find all check boxes from that row and change the status of all in to the variable value.

0 comments:

Post a Comment