HowTo: check all checkboxes in a table to select/deselect all rows with jQuery

Massimiliano Petrilli/ May 5, 2017/ WebDevelopment/ 0 comments

Mi first tech post is about a recent trick that I wrote in JavaScript to let the user be able to check all the checkbooks in a table, the standard problem that everyone has bumped on in a website that has use interaction with lot of datas.

First of all we have to write the structure of our HTML table, here is a sample:

The page render follows:


With a very little function in JavaScript, with the help of jQuery, we can cycle through the table rows and check all the checkbooks that are wrapped into a span with the classes “checkbox checkbox-row_selection”.

In the document ready section of our JavaScript we have to associate the onClick event on a button or anything we want the user to click to select or deselect our checkbox, here is the code:

Share this Post

Leave a Comment

Your email address will not be published.


This site uses Akismet to reduce spam. Learn how your comment data is processed.