DHTMLX Docs & Samples Explorer
All components
dhtmlxTree
Checkboxes

Mixed mode - check boxes/radio buttons

View page source

dhtmlxTree supports check boxes and radio buttons modes. You can set an appropriate mode for a specific branch of nodes using the tree.enableRadioButtons() method. Setting this method to true enables radio buttons, to false - check boxes.
Switch Dan Brown to radio buttons

Switch Dan Brown to check boxes

Get list of checked

THIS PAGE CONTAINS SAMPLE FUNCTIONALITY OF PROFESSIONAL EDITION FOR DEMONSTRATION PURPOSE ONLY.
UNAUTHORIZED USE IS PROHIBITED. PLEASE CONTACT SALES@DHTMLX.COM TO OBTAIN A LEGAL COPY OF PROFESSIONAL EDITION.
Source
 
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxtree.css">
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxtree.js"></script>
<table>
    <tr>
        <td valign="top">
            <div id="treeboxbox_tree" style="width:250px; height:218px;background-color:#f5f5f5;border :1px solid Silver;"></div>
        </td>
        <td style="padding-left:25" valign="top">
        <br>
        <a href="javascript:void(0);" onClick="tree.enableRadioButtons('db',true);">Switch Dan Brown to radio buttons</a><br><br>
        <a href="javascript:void(0);" onClick="tree.enableRadioButtons('db',false);">Switch Dan Brown to check boxes</a><br><br>
        <a href="javascript:void(0);" onClick="alert(tree.getAllChecked());">Get list of checked</a><br><br>
        </td>
    </tr>
</table>
<br>
<script>
tree = new dhtmlXTreeObject("treeboxbox_tree", "100%", "100%", 0);
tree.setSkin('dhx_skyblue');
tree.setImagePath("../../codebase/imgs/");
tree.enableCheckBoxes(1);
tree.enableSmartXMLParsing(true);
tree.loadXML("../common/tree_radio.xml");
</script>
Copyright © 1998-2011 DHTMLX LTD.
All rights reserved.