Name: Multirow-Checkbox-Menu
Owner: Simpleweb
Description: jQuery plugin to put those cool little Google Gmail type 'Select All/Select None' action menus at the top of a list of check boxes.
Created: 2010-10-18 19:33:07.0
Updated: 2016-02-04 22:25:38.0
Pushed: 2012-03-28 00:13:37.0
Homepage: simpleweb.github.com/Multirow-Checkbox-Menu
Size: 122
Language: JavaScript
GitHub Committers
| User | Most Recent Commit | # Commits |
|---|
Other Committers
| User | Most Recent Commit | # Commits |
|---|
By Tom Holder - http://www.simpleweb.co.uk
This is an unobtrusive jQuery plugin to put those cool little Google Gmail type 'Select All/Select None' action menus at the top of a list of check boxes.
First include the jquery.multirowcheckboxmenu.js file in your page.
<script src="/path/to/jquery.js" type="text/javascript"></script>
<script src="/path/to/jquery.multirowcheckboxmenu.js" type="text/javascript"></script>
Markup your menus as follows:
<div class="multiRowCheckboxMenu">
<input type="submit" name="Delete" value="Delete" />
<input type="submit" name="Merge" value="Merge" />
</div>
You will notice the markup just contains form submit buttons. This is so the functionality degrades without javascript. If Javascript is enabled, each submit input will be replaced with an element in the menu drop down. The form will be submitted with the same named action value.
Then apply the multirowcheckbox plugin to the container:
$('div.multiRowCheckboxMenu').checkboxMenu();
If you ID or class the submit buttons inside the container, those IDs/classes will get passed over to the LIs to provide more styling control.
The plugin can also be used as a simple filter menu without the checkbox for things such as Sort Alphabetically, Filter by Letter etc. To do this, you must just have a input item with a class of selected. See index.html for example.
This plugin was built for our fabulous ContactZilla product! http://contactzilla.com/
This plugin is licensed under both the GPL and MIT licenses. Choose which ever one suits your project best.
