dhtmlxGrid & dhtmlxTree interaction

Implementing both dhtmlxGrid & dhtmlxTree in your application you can improve flexibility and functionality of its user interface by interaction between these components.
Drag-and-drop elements from tree to grid and vice versa.

 
<script> 
        ...
        tree.enableDragAndDrop(true);
        mygrid.enableDragAndDrop(true);
        ...
        //redefine tree-to-grid drop element
        mygrid.treeToGridElement = function(treeObj,treeNodeId,gridRowId){
            return [0,treeObj.getItemText(treeNodeId)];
        }
 
        //redefine grid-to-tree drop element
        mygrid.gridToTreeElement = function(treeObj,treeNodeId,gridRowId){
            return this.cells(gridRowId,1).getValue()+"/"+this.cells(gridRowId,2).getValue();
        }
 
 
        mygrid.rowToDragElement = function (id){
            return this.cells(id,2).getValue()+"/"+this.cells(id,1).getValue();
        }</script>

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.