$(‘#check-all’).click(function(evt){
if($(this).is(‘:checked’)){
$(‘input[type="checkbox"]‘).attr(‘checked’, ‘checked’);
}
else{
$(‘input[type="checkbox"]‘).removeAttr(‘checked’);
}
});

the selectors are the key to success..

GENERAL REQUIREMENTS
225

ANNEX 6
14

JAR–OPS
135

NAVIGATION REQUIREMENTS FOR LONG RANGE FLIGHTS
76

SPECIAL OPERATIONAL
208

OPERATIONS MANUAL
11

ICING CONDITIONS
21

etc…etc..etc

I am using the following jquery to add the collapsable functionality and would like to incorporate what you have created here to control the checkboxes within each section.

$(document).ready(function() {

$(‘tr:not(.parent)’).hide();

var toggleMinus = ‘../images/icons/toggle_minus.png’;
var togglePlus = ‘../images/icons/toggle_plus.png’;
var $subHead = $(‘tbody th:first-child’);
$subHead.prepend(”);
$(‘img’, $subHead).addClass(‘clickable’)
.click(function() {

var toggleSrc = $(this).attr(‘src’);

if ( toggleSrc == toggleMinus ) {

$(this).attr(‘src’, togglePlus)

.parents(‘tr’).siblings().fadeOut(‘slow’);

} else{

$(this).attr(‘src’, toggleMinus)

.parents(‘tr’).siblings().fadeIn(‘slow’);

};
});
})

I have incorporated your code, and it works perfectly but i would like it to control just the checkboxes in the rows associated ith their respective parents and vice versa. I am pretty sure it would be possible???? Sorry if this is a little long winded i have an idea in my head but i am new to javascript and jquery so it’s like building a giant jigsaw in the dark.

Thanks

Thankyou for sharing Eric, that’ll be so useful for everyone…

1. Cache your queries.
2. Use the DOM element where possible instead of the “jQuery” way (this.checked over $(this).is(“:checked”)).
3. Give your class selectors a node type context (input.cb-element instead of just .cb-element).
4. Consider using bind() instead of live(). On something this simple live does not give you any benefits, until you have a huge amount of checkboxes or are adding/removing them dynamically.

See below, or http://jsfiddle.net/KdHKh/

$(function(){
var $inputs = $(‘input.cb-element’), $checkall = $(‘input.checkAll’);

$checkall.live(‘change’, function(){
$inputs.attr(‘checked’, this.checked ? ‘checked’ : ”);
$(this).next().text( this.checked ? ‘Uncheck All’ : ‘Check All’);
});

$(‘a.invertSelection’).live(‘click’, function(){
$inputs.each(function(){
this.checked = !this.checked;
}).trigger(‘change’);
});

$inputs.live(‘change’, function(){
$inputs.length === $inputs.find(‘:checked’).length
? $checkall.attr(‘checked’, ‘checked’).next().text(‘Uncheck All’)
: $checkall.removeAttr(‘checked’).next().text( ‘Check All’ );
});
});