Return to Snippet

Revision: 59811
at October 3, 2012 03:51 by ReedD19


Updated Code
var lastChecked = null;
var handleChecked = function(e) {
    if(lastChecked && e.shiftKey) {
        var i = $('input[type="checkbox"]').index(lastChecked);
	var j = $('input[type="checkbox"]').index(e.target);
	var checkboxes = [];
	if (j > i) {
	    checkboxes = $('input[type="checkbox"]:gt('+ (i-1) +'):lt('+ (j-i) +')');
	} else {
	    checkboxes = $('input[type="checkbox"]:gt('+ j +'):lt('+ (i-j) +')');
	}

	if (!$(e.target).is(':checked')) {
	    $(checkboxes).removeAttr('checked');
	} else {
	    $(checkboxes).attr('checked', 'checked');
	}
    }
    lastChecked = e.target;

    // Other click action code.

}
$('input[type=checkbox]').click(handleChecked);

Revision: 59810
at October 3, 2012 03:48 by ReedD19


Initial Code
var handleChecked = function(e) {
    if(e.shiftKey) {
        var i = $('input[type="checkbox"]').index(lastChecked);
	var j = $('input[type="checkbox"]').index(e.target);
	var checkboxes = [];
	if (j > i) {
	    checkboxes = $('input[type="checkbox"]:gt('+ (i-1) +'):lt('+ (j-i) +')');
	} else {
	    checkboxes = $('input[type="checkbox"]:gt('+ j +'):lt('+ (i-j) +')');
	}

	if (!$(e.target).is(':checked')) {
	    $(checkboxes).removeAttr('checked');
	} else {
	    $(checkboxes).attr('checked', 'checked');
	}
    }
    lastChecked = e.target;
}
$('input[type=checkbox]').click(handleChecked);

Initial URL


Initial Description
Allows you to click a given checkbox X, then shift click another checkbox Y. All checkboxes between X and Y will be checked or unchecked based on the state of checkbox Y. i.e. if you're unchecking Y all boxes between X and Y will also be unchecked.

Initial Title
Shift+Click to Select/Deselect Checkboxes.

Initial Tags
form, jquery

Initial Language
JavaScript