Sample: dhtmlxTree Checkboxes dhtmlxTree main page
X

This JavaScript tree has checkbox system in order to use this component as a navigation bar with selection lists. Besides usual two-state checkboxes (checked item, unchecked item), there is a possibility to use three state checkboxes with "partly-checked" value (some sub-items are checked).

 Two state checkboxes

Check item

UnCheck item

Check branch

UnCheck branch

Get list of checked
Three state checkboxes

Check item

UnCheck item

Get list of checked

 
 
<div id="treeboxbox_tree" style="width:200;height:200"></div>
<script>
 
            tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);
            tree.setImagePath("../imgs/");
            //enable checkboxes
            tree.enableCheckBoxes(1);
            tree.loadXML("tree.xml");
            ....
            //check item
            tree.setCheck(id,true);
            //uncheck item
            tree.setCheck(id,false);    
            //check branch
            tree.setSubChecked(id,true);
            //uncheck branch
            tree.setSubChecked(id,false);    
            //check item
            tree.setCheck(id,true);
            //return ids of checked items
            var list=tree.getAllChecked();
</script>
© DHTMLX LTD. All rights reserved