client-side Check All/Uncheck All

[Margo Noreen]

I'm looking for some example markup/code or direction on what I think is probably a fairly common thing.  But I'm having a bit of trouble figuring out the right pieces. 

I need a grid that has two checkboxes (in 2 columns) along with some other columns.  I'd also like to put a checkbox in the grid's header area above each checkbox column so that the user can toggle the checked state of all the checkboxes in that column.  I'd like that to all be done client-side.

Any guidance would be greatly appreciated.


I should mention a couple of points

1) I'm not trying to select grid rows.  In the header, if I click "Check All", I just want to iterate through all rows and set the checked state of 2 checkboxes. I don't know if the ColumnClick event is the right place to start.  And if so, how then do I loop through all the rows, find the checkbox in the row and set it's checked state to match?

2) I'm also trying to implement mutually exclusive checkboxes.  So when I click an individual checkbox in a row, I want to be sure to deselect/uncheck the other checkbox in the row.

All client-side.

Thanks in advance.

[Shinu]

Hello Margo,

Check the following demo.
Grid / Client-Side Row Selection

-Shinu.