How do I tick all checkboxes of the other sections by ticking a checkbox found inside the current se


The folliwing fiddle is ok, read below what I need to change at it.

<a href="http://jsfiddle.net/V5SSM/14/" rel="nofollow">http://jsfiddle.net/V5SSM/14/</a>

You click on ☑ Subsection 1.1 and then all other get clicked:

<ul><li>☑ Subsection 2.1</li> <li>☑ Subsection 2.2</li> <li>☑ Subsection 2.3</li> <li>☑ Subsection 2.4</li> <li>☑ Subsection 3.1</li> <li>☑ Subsection 3.2</li> <li>☑ Subsection 3.3</li> <li>☑ Subsection 3.4</li> </ul>

Here is the HTML tree:

Section 1

Subsection 1.1 Subsection 1.2 Subsection 1.3 Subsection 1.4

Section 2

Subsection 2.1 Subsection 2.2 Subsection 2.3 Subsection 2.4

Section 3

Subsection 3.1 Subsection 3.2 Subsection 3.3 Subsection 3.4

More Details:

You can see that the current jsfiddle example works. It works to tick all checkboxes of the current section while ticking one checkbox from inside the current section. I want it to work the same, but not to tick checkboxes of its own section, rather to tick all other checkboxes of the other sections.

Example: I select with "Subsection 1.1" all other sections that are not Section 1. "Subsection 1.1" should select all other: Subsection 2.1, Subsection 2.2, Subsection 2.3, Subsection 2.4, Subsection 3.1, Subsection 3.2, Subsection 3.3, Subsection 3.4


You can handle click on all checkboxes using event delegation mechanism by attaching the handler on the first common ancestor :

var type = 'input[type="checkbox"]'; $('#selectAllButton').on('click', function () { $(type).prop('checked', true).closest('label').addClass('c_on'); }); $('#selectNoneButton').on('click', function () { $(type).prop('checked', false).closest('label').removeClass('c_on'); }); // event Delegation $('#docbuilder').click(function(e){ var $t = $(this), $tar = $(e.target); // The node that has been clicked // If checkbox if($tar.is(type)){ var cbRemaining = $tar.closest('blockquote').find(type+':checked').length, /* counting how many checked checkboxes remain inside the current section */ $otherCb = $t.children(':nth-child(n+3)').not($tar.closest('.document')[0]).find(type), /* Retrieve all checkboxes except the ones that belong to the current section */ state = $tar.prop('checked'); // get the checked property of the checkbox beiing clicked // If subsection checkbox if($tar.closest('.subsection').length){ if( !cbRemaining ){ $tar.closest('blockquote').prev().find(type).prop('checked', false); } if( !cbRemaining || cbRemaining==1 && state){ $otherCb.prop('checked', state); } $tar.parent()[(state ? 'addClass':'removeClass')]('c_on'); // should we add or remove the color class on the checkbox label // If section checkbox } else if($tar.closest('.section').length){ if(state) $otherCb.prop('checked', false); $tar.parent().siblings().find(type).prop('checked', state) .parent()[(state ? 'addClass':'removeClass')]('c_on'); } } });

You may need to modify this code a bit accordingly to some constraints not yet taken into account.


  • Jquery .delay().fadeOut cancel/clear queue.. Is it possible? How?
  • Quartz.net + testing with SystemTime.UtcNow
  • kill process/ end process of bluestacks
  • Restricted profiles settings not being remembered
  • symfony 2 phpunit - how to untick checkbox in form field
  • ScheduledThreadPoolExecutor only “ticking” once
  • Getting the result of the promise returned by an asyncValidator
  • Insert Pandas dataframe into Cassandra Table
  • Integrate two requests into one Javascript
  • How to display the hotel names that have the maximum count from data base by calculating sum in PHP?
  • jquery add an event handler to objects in an array
  • How to move axis labels automatically in rgl R
  • How do I deploy my Node.js app with a opencv4nodejs dependency to Heroku?
  • SSRS 2008 - Sorting within a group
  • UI-GRID column summation on checkbox change
  • iOS custom UTI in UIDocumentPickerViewController initWithDocumentTypes
  • What do I do with this error when I run tests in rails?
  • How do I add a UIAlertController in app delegate (obj-c)
  • Why does IE8 fail to resolve my JQuery selector for a checked radio option?
  • Unicorn and Rails eat up 2x MySQL connections
  • How to name a 'group' check box in Adobe Reader when wanting to fill form by FDF / XFDF
  • What is the reason that Policy.getPolicy() is considered as it will retain a static reference to the
  • Is there any purpose for h2-h6 headings in HTML5?
  • Segmentation Fault on MySQL2 / Ruby 1.9.3 / Rails 3.2
  • Where these are stored?
  • Add reference to ASP.NET 5 Class Library from Framework 4.5 Class Library Project
  • Aptana 3 remove bundle (jquery)
  • How do I retrieve the user information of a user authenticated with Apache's mod_ldap?
  • Primefaces ManyCheckbox inside ui:repeat calls setter method only for last loop
  • Uncaught TypeError: $(…).select2 is not a function
  • Angularjs pass function from Controller to Directive (or call controller function from directive) -
  • Lost migrations and Azure database is now out of sync
  • Master page gives error
  • SSO with signing and signature validation doesn't work
  • Why is the timeout on a windows udp receive socket always 500ms longer than set by SO_RCVTIMEO?
  • R: gsub and capture
  • jqPlot EnhancedLegendRenderer plugin does not toggle series for Pie charts
  • Comma separated Values
  • Matrix multiplication with MKL
  • How to load view controller without button in storyboard?