How To Implement Select All/Unselect All CheckBoxes in GridView Rows

Friends,

In my last posts, I explained How To Add CheckBox to GridView and How To Get Selected Multiple Rows From GridView. In this post, I will explain how can  you select/unselect all rows of a GridView by selecting a CheckBox in client side.

We will start with using the same GridView, we are using in our previous examples. The only difference I will make here is add a CheckBox in the header of the Checkbox column using the HeaderTemplate clicking on which will toggle the state of checkboxes in each row of the GridView. To toggle the state of check boxes, we will use a little bit of jQuery. Below is the code for the same.

Code for ASPX Page:

Javascript/jQuery Code: To be used in header/footer of the page where the grid is loaded.

You’re done.

Hope you like this! Keep learning and sharing! Cheers!