jeudi 12 décembre 2019

How to handle checkbox in a tree?

I've build a dynamic "checkbox" tree which is created from a JSON in my navbar, now i would handle the selected checkbox and to create a "node" between all of them like if i select parent checkbox all children checkbox will be selected or if i just select one checkbox inside the parent it should be set as indeterminate, there could be another parent checkbox inside that tree.

I was trying to use the following method to "manage" the checkbox tree but i have no effect.

$('ul#sidebar input[type="checkbox"]').each (
 function () {
  $(this).bind('click change', function (){
   if($(this).is(':checked')) {
    $(this).siblings('ul').find('input[type="checkbox"]').attr('checked', 'checked');
    $(this).parents('ul').siblings('input[type="checkbox"]').attr('checked', 'checked');
   } else {
    $(this).siblings('ul').find('input[type="checkbox"]').removeAttr('checked', 'checked');
   }
  });
 }
);

Here is a JSFiddle with an example nav-item with checkbox tree




Aucun commentaire:

Enregistrer un commentaire