DHTMLX Docs & Samples Explorer

Copy with Drag-n-Drop

Mercy drag-and-drop allows you to copy nodes from one tree to another. In the current sample it is enabled for the left tree.




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;">
            </div>
        </td>
        <td style="padding-left:25" valign="top">
            <div id="treeboxbox_tree2" style="width:250px; height:218px;background-color:#f5f5f5;border :1px solid Silver;">
            </div>
        </td>
    </tr>
    <tr>
    </tr>
</table>
<br>
 
<script>
tree = new dhtmlXTreeObject("treeboxbox_tree", "100%", "100%", 0);
tree.setSkin('dhx_skyblue');
tree.enableDragAndDrop(true);
tree.enableMercyDrag(true);
tree.enableCheckBoxes(true);
tree.setImagePath("../../codebase/imgs/csh_bluefolders/");
tree.enableSmartXMLParsing(true);
tree.loadXML("../common/tree_a.xml");
 
tree2 = new dhtmlXTreeObject("treeboxbox_tree2", "100%", "100%", 0);
 
tree2.setSkin('dhx_skyblue');
tree2.setImagePath("../../codebase/imgs/");
tree2.enableDragAndDrop(true);
tree2.enableSmartXMLParsing(true);
tree2.insertNewItem(0, "1", "Root");
</script> <br><br>