DHTMLX Docs & Samples Explorer

Attach Tree

Source
<meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../../../dhtmlxToolbar/codebase/skins/dhtmlxtoolbar_dhx_skyblue.css"/>
    <link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxpopup_dhx_skyblue.css"/>
    <link rel="stylesheet" type="text/css" href="../../../dhtmlxTree/codebase/dhtmlxtree.css">
    
    <script src="../../codebase/dhtmlxcommon.js"></script>
    <script src="../../../dhtmlxToolbar/codebase/dhtmlxtoolbar.js"></script>
    <script src="../../../dhtmlxTree/codebase/dhtmlxtree.js"></script>
    <script src="../../codebase/dhtmlxpopup.js"></script>
    
    <style>
        #myToolbar {
            margin: 10px;
        }
    </style>
    <script>
 
var myToolbar;
var myPop;
var myTree;
 
function doOnLoad() {
 
    myToolbar = new dhtmlXToolbarObject("myToolbar", "dhx_skyblue");
    myToolbar.setIconsPath("../common/imgs/");
    myToolbar.loadXML("../common/toolbar.xml?etc=" + new Date().getTime(), function() {
 
        myToolbar.setItemText("workbut", "Tree");
 
        myPop = new dhtmlXPopup({
            toolbar: myToolbar,
            id: "workbut"
        });
 
        myTree = myPop.attachTree(350, 300);
        myTree.setImagePath("../../../dhtmlxTree/codebase/imgs/csh_vista/");
        myTree.setSkin("dhx_skyblue");
        myTree.loadXML("../common/tree.xml?etc=" + new Date().getTime());
 
        myTree.attachEvent("onDblClick", function(id) {
            if (myTree.hasChildren(id) == 0)
                myPop.hide();
            return true;
        });
 
    });
 
}
</script> <style> </style> <div id="myToolbar"></div>