CHECKMATES
Module for sane checkbox handling. Create a bunch of html checkbox's and manage with EventEmitter events using checkbox state and value. Get a master checkbox which can check / uncheck all other checkboxes. The master checkbox automatically shows the proper indeterminant states. Can use with a single group, or multiple, each with their own master (each group is an event emitter instance). All checkboxes produced by a particular checkmates
instance automatically have their class set to the groupID
the checkmate
function was instantiated with. The master has the additional CSS class of groupID-master
.
Example
var CheckMate = var result = document checks = document checkgroup = /* * Build 5 checkboxes in a group */var checker = var i checkvar checked = truefor i = 0; i < 5; i++ check = checker checks /* * Set Master */var master = checker checks /* * Set some eventhandling */checker checker checker checker
API
Create new group
group = Checkmate("groupID")
Create new checkbox
Create a checkbox part of group groupID
checkbox = group.checkbox(value [, data])
where value
is a String
and is set to the html checkbox's value attribute. data
is an optional arbitrary data object you can normally pass around with event emitters.
Also checkbox html class is set to groupID
Create new master
Create a master checkbox for group groupID
master = group.master(value [, data])
Master behaves as a checkbox but also if any checkboxes are set, the master is put into an indeterminate state. Clicking master in the indeterminate state will uncheck all checkboxes part of group groupID
. Clicking master when nothing is checked will check all checkboxes part of group groupname
including master. Master has the additional CSS class groupID-master
.
Creating a new master just overwrites the old master - and is as of yet, untested.
Checked Checkboxes
Often you want to know what checkboxes are checked, so you use the group.checked
object. The keys are the value
parameter and the values are the checkmate checkbox elements.
Checkmates
group.checkmates
is an array of all the checkmate checkboxes part of group groupID
.
checkAll
group.checkall()
does what it says. It checks all non-master checkmate checkboxes.
uncheckAll
group.uncheckAll()
unchecks all checked checkmate checkboxes. (say that five time quickly)
Remove all
group.removeAll()
removes all checkboxes associated with group groupID
properly. That is, it unchecks them first, removing them from group.checked
before performing the remove on group.checkmates
.
Install
npm install checkmates
Browser
Write your code then do
browserify main.js -o bundle.js
and put bundle.js
in your index.html
see browserify
node-webkit
Works great withJust include it normally. Good for single-page apps
License
MIT