Download @ Forge JS

Quickboxes

Quickboxes is a MooTools-based class that allows users to click down on a checkbox and drag their mouse over other checkboxes to check or uncheck numerous checkboxes within one click.

MooTools Javascript Class

/*
Script: Quickboxes

License: MIT-style license.

Copyright: Copyright (c) 2007-2009 [David Walsh](http://davidwalsh.name/).

Author: David Walsh (http://davidwalsh.name)
*/
var Quickboxes = new Class({

	//implements
	Implements: [Options],

	//options
	options: {
		elements: 'input[type=checkbox]',	//checkboxes to use
		mode: 'toggle'						//toggle|check|uncheck
	},

	//initialization
	initialize: function(options) {
		//set options
		this.setOptions(options);
		//prevent drag start in IE
		document.ondragstart = function () { return false; };
		//ensure that the elements are a Element
		this.options.elements = $$(this.options.elements);
		//manage the checkbox actions
		this.manage();
	},

	//a method that does whatever should be done
	manage: function() {
		var active = 0;
		this.options.elements.each(function(el) {
			el.addEvents({
				'mousedown': function(e) {
					e.stop();
					active = 1;
					el.checked = !el.checked;
				},
				'mouseenter': function(e) {
					if(active === 1) {
						el.checked = ('toggle' == this.options.mode ? !el.checked : 'check' == this.options.mode);
					}
				}.bind(this),
				'click': function(e) {
					el.checked = !el.checked;
					active = 0; 
				}
			});
		}.bind(this));
		var label = $$('label[for=' + el.get('id') + ']');
		if(label.length) {
			label[0].addEvent('click',function() {
				el.checked = !el.checked;
			});
		}
		window.addEvent('mouseup',function() { active = 0; });
	}
});

Class: Quickboxes

Quickboxes is a MooTools-based class that allows users to click down on a checkbox and drag their mouse over other checkboxes to check or uncheck numerous checkboxes within one click.

Implements:

Options

Quickboxes Method: constructor

Syntax:

var myQuickboxes = new Quickboxes(options);

Arguments:

  1. options - (object) Initial options for the class.

Options:

  • elements - (string, defaults to 'input[type=checkbox]') The checkbox elements for which the Quickboxes will be controlled by.
  • mode - (string, defaults to 'toggle') The checkbox group's mode ('toggle', 'check', or 'uncheck')

Returns:

A Quickboxes instance.

© David Walsh 2007-2010. Contact David Walsh. Powered by the remarkable MooTools javascript framework.