SelectAllCheckbox Plugin: Check & Uncheck All Checkboxes On Single Click

Category: Form JavaScript/jQuery Plugins Recommended | September 2, 2021
Author: kloverde
Official Page: Go to website
Last Update: September 2, 2021
License: MIT

What is it?

Are you tired of writing JavaScript/jQuery codes to check and uncheck all check-boxes? Here is good news for you. Now, you can do it by including a light weighted plugin written in vanilla JavaScript.

How to use it?

You can use this plugin in your page just by including SelectAllCheckbox as below:

<script type="text/javascript" src="PATHTOSCRIPT/selectallcheckbox.js"></script>

And then, create checkbox elements as below:

<div id="checkboxes">
<h3>Group 1</h3>
    <label class="selectAllLabel">
	<input type="checkbox" id="selectAllGroup1"/>
	Select All
	<input type="checkbox" id="group1_a" name="group1" value="1a"/>
	Choice A
        <input type="checkbox" id="group1_b" name="group1" value="1b"/>
        Choice B
        <input type="checkbox" id="group1_c" name="group1" value="1c"/>
        Choice C
    <button id="getState1">Get state</button>

And now the time to initialize the plugin and pass the parameters in CheckboxGroup()

const group1 = new CheckboxGroup(
function onChange( checkboxes, checkedState ) {
            var html = "<p>Changed:<br/>";
            for( var i = 0; i < checkboxes.length; i++ ) {
               var box = checkboxes[i];
               var line = + " : " + ( box.checked ? "checked" : "unchecked" ) + "<br/>";
               html += line;
            html += ("</p><p>Checked state of group is: " + checkedState + "</p>");
            document.getElementById( "log" ).innerHTML = html;

In above code, there are three parameters:

  • selectAllGroup1: This is ‘Select All’ checkbox id. Users will click on this checkbox to check and uncheck checkboxes.
  • group1: This the name attribute of check-boxes.
  • onChange: This is the onChange callback event. A user can pass his own function name that will perform a specific activity when the user checks all checkboxes.


  • Update Redeme (2021-07-07)