$$(“input[type$=checkbox].check-me“)

This post is quite old, maybe I should update it.

Here’s the code that works (shorter too!)

@param container => The mootools representation of the element id that all the checkboxes are in. Eg “#myElementId”
@param obj => Set to ‘this’. That’s because the onclick event should be on the checkbox that is the SelectAll/None, so ‘this’ refers to the current state of this checkbox.

function toggleCheckboxes(container,obj){
$$(container+” input[type=checkbox]“).each(function(el){
el.checked = obj.checked;
});
}

Set var yourContainer to be the id of the surrounding html element.
Example, if your container had an id of “monkey” then var yourContainer = “#monkey”. This way it only targets checkboxes in that area. It’s a far better global solution than putting a class on each checkbox.

This method takes the first checkbox found and uses it as a reference for the others to follow, to avoid mismatch checking.

$$(yourContainer+” input[type=checkbox]“).each(function(el,c){
this.cbp = c==0?(el.checked?false:true):this.cbp;
el.checked = this.checkMe;
});

Simplez.

One question: what would you do if you have multiple tables, each inside its own form, and you want to check/uncheck only the checkboxes inside each particular table?

What did I miss here?

$(‘ucuc’).addEvent(‘click’, function() {
if($(‘ucuc’).get(‘rel’) == ‘yes’)
{
do_check = false;
$(‘ucuc’).set(‘src’,'checkboxes/uncheck.jpg’).set(‘rel’,'no’);
}
else
{
do_check = true;
$(‘ucuc’).set(‘src’,'checkboxes/check.jpg’).set(‘rel’,'yes’);
}
$$(‘.check-me’).each(function(el) { el.checked = do_check; });
});

You could just do:

$(‘ucuc’).addEvent(‘click’, function() {
$$(‘.check-me’).set(‘checked’,$(‘ucuc’).getProperty(‘checked’));
});

could be

$$(‘.check-me’).set(‘checked’,do_check)

Since all Element methods can be applied over instances of Elements class ($$ returns it). Those methods apply loops internally (see Elements.multi)
:)