Drag and Drop

Sample: dhtmlxTree

Drag and Drop

This JavaScript tree menu has extended drag-and-drop functionality (within one tree, between trees, between frames). Drop-as-sibling behavior makes it easy to reorder nodes in a tree view. You can easily edit the tree by dragging nodes within one tree or between trees or even to another object.

Drag&Drop works in each tree and between trees too.

 
<div id="treeboxbox_tree" style="width:200;height:200"></div>
<script> 
            tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);
            tree.setImagePath("../images/");
            
            //enable Drag&Drop
            tree.enableDragAndDrop(1);
            //set my Drag&Drop handler
            tree.setDragHandler(myDragHandler);
            tree.loadXML("tree.xml");
 
            function myDragHandler(idFrom,idTo){
                //if we return false then drag&drop be aborted
                return true;
            }</script>