Check/Uncheck All Related Checkboxes - jQuery create-checkall
| File Size: | 5.27 KB |
|---|---|
| Views Total: | 1697 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Just another jQuery 'Check All' plugin that enables a checkbox to check/uncheck all of its child checkboxes when checked/unchecked.
How to use it:
1. Load the minified version of the jQuery create-checkall plugin after jQuery library.
<script src="//code.jquery.com/jquery.min.js"></script> <script src='jquery-create-checkall.min.js'></script>
2. Group your checkboxes with the same CSS class as these:
<label><input type="checkbox" class="checkbox-label-around" value="one" checked><span class="label-text">One</span></label> <label><input type="checkbox" class="checkbox-label-around" value="two" checked><span class="label-text">Two</span></label> <label><input type="checkbox" class="checkbox-label-around" value="three" checked><span class="label-text">Three</span></label> <label><input type="checkbox" class="checkbox-label-around" value="four" checked><span class="label-text">Four</span></label>
3. Call the function to generate a 'Check All' checkbox before the checkbox group.
$('.checkbox-label-around').createCheckAll({
label: 'Custom label here'
});
4. To config the 'Check All' checkbox, override the following options values and pass them as an object to the createCheckAll function.
$('.checkbox-label-around').createCheckAll({
// target selector
allSelector: null,
// adds a <br> after the check all checkbox
breakAfter: false,
// additional CSS classes
classes: null,
// additional CSS IDs
id: null,
// custom label text
label: 'All',
// or 'after'
position: 'before'
});
This awesome jQuery plugin is developed by andreoliva. For more Advanced Usages, please check the demo page or visit the official website.











