DHTMLX Docs & Samples Explorer

Multiselection

When the multiselection functionality is enabled you can select multiple items using Ctrl-click.
Drag and drop is also supported in the multiselection mode.
Cut and Paste functionality is available as well. Check it out!

Enable Multiselection
Enable Strict Multiselection
Disable Multiselection

Cut
Paste
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>
            <div id="treeboxbox_tree" style="width:250px; height:218px;background-color:#f5f5f5;border :1px solid Silver;; overflow:auto;"></div>
        </td>
        <td rowspan="2" style="padding-left:25" valign="top">
            <a href="#" onClick="tree.enableMultiselection(true);">Enable Multiselection</a><br>
            <a href="#" onClick="tree.enableMultiselection(true,true);">Enable Strict Multiselection</a><br>
            <a href="#" onClick="tree.enableMultiselection(false);">Disable Multiselection</a><br>
            <hr/>
            <a href="#" onClick="tree.doCut();">Cut</a><br>
            <a href="#" onClick="tree.doPaste(tree.getSelectedItemId());">Paste</a><br>
        </td>
    </tr>
    <tr>
        <td>
        </td>
    </tr>
</table>
 
<script>
tree = new dhtmlXTreeObject("treeboxbox_tree", "100%", "100%", 0);
 
tree.setSkin('dhx_skyblue');
tree.setImagePath("../../codebase/imgs/csh_bluebooks/");
tree.enableSmartXMLParsing(true);
tree.enableDragAndDrop(true);
tree.loadXML("../common/tree3_14_selection_sorting_navigation.xml");
</script>