Grid linked to tree

Tree can be used as editor for the grid. Try to edit column with authors.

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="../../../dhtmlxTree/codebase/dhtmlxtree.css">
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxgrid.js"></script>
<script  src="../../codebase/dhtmlxgridcell.js"></script>    
<script  src="../../../dhtmlxTree/codebase/dhtmlxtree.js"></script>
<script  src="../../codebase/excells/dhtmlxgrid_excell_tree.js"></script>
    <style>
        .containerTableStyle { overflow : auto; position:relative; top:0; font-size : 12px;
            border : 1px solid #333;
            background: #FFF;
        }
    </style>
 
 
<div id="gridbox" style="width: 600px; height: 270px; background-color:white;"></div>
<div id="treeboxbox_tree" style="width:300px;height:200px"></div>
<script>tree = new dhtmlXTreeObject("treeboxbox_tree", "100%", "100%", 0);
tree.setImagePath("../../../dhtmlxTree/codebase/imgs/csh_bluebooks/");
tree.setSkin("dhx_skyblue");
tree.loadXML("../common/tree.xml", function() {
    mygrid = new dhtmlXGridObject('gridbox');
    mygrid.setImagePath("../../codebase/imgs/");
    mygrid.setHeader("Sales, Book Title, Author,Price,In Store,Shipping,Bestseller,Date of Publication");
    mygrid.setInitWidths("50,150,100,80,80,80,80,200");
    mygrid.setColAlign("right,left,left,right,center,left,center,center");
    mygrid.setColTypes("dyn,ed,stree,price,ch,co,ra,ro");
    mygrid.setSubTree(tree, 2, 0);
    mygrid.init();
    mygrid.setSkin("dhx_skyblue");
    mygrid.loadXML("../common/linked_grid.xml");
});</script>