Shift + Click To Select Multiple Checkboxes

A super tiny jQuery plugin that allows the user to use select multiple checkboxes with Shift key.

A typical use of this plugin is to select multiple rows in a data table as you see on Google Gmail.

See Also:

• Select Multiple Checkboxes With Ctrl and Shift Keys
• Touch-enabled Checkbox Multiple Selection Plugin - jQuery Checkboxrange

How to use it:

1. Insert a group of checkboxes with the same data-chkbox-shiftsel property into your webpage.

<table class="table ">
  <tr>
    <td>Some text 1</td>
    <td><input type="checkbox" name="data1" value="1" data-chkbox-shiftsel="type1"></td>
    <td><input type="checkbox" name="data2" value="1" data-chkbox-shiftsel="type2"></td>
  </tr>
  <tr>
    <td>Some text 2</td>
    <td><input type="checkbox" name="data1" value="2" data-chkbox-shiftsel="type1"></td>
    <td><input type="checkbox" name="data2" value="2" data-chkbox-shiftsel="type2"></td>
  </tr>
  <tr>
    <td>Some text 3</td>
    <td><input type="checkbox" name="data1" value="3" data-chkbox-shiftsel="type1"></td>
    <td><input type="checkbox" name="data2" value="3" data-chkbox-shiftsel="type2"></td>
  </tr>
  <tr>
    <td>Some text 4</td>
    <td><input type="checkbox" name="data1" value="4" data-chkbox-shiftsel="type1"></td>
    <td><input type="checkbox" name="data2" value="4" data-chkbox-shiftsel="type2"></td>
  </tr>
  <tr>
    <td>Some text 5</td>
    <td><input type="checkbox" name="data1" value="5" data-chkbox-shiftsel="type1"></td>
    <td><input type="checkbox" name="data2" value="5" data-chkbox-shiftsel="type2"></td>
  </tr>
</table>

2. Load both jQuery JavaScript library and the checkbox-shift-selector.js script at the end of the document. That's it.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/jquery.checkbox-shift-selector.js"></script>

---

This awesome jQuery plugin is developed by iTeeLion. For more Advanced Usages, please check the demo page or visit the official website.