Add dhtmlxTree to combo

Suite and Optimus Suite 5
#1

Hi,

i’m having toolbar with a combobox.

and i would like to make a combobox with dropdown tree.

i know dhtmlxpopup but i need combobox.

is there a way to load tree in combobox

Thank a lot.
Regards,

Hee-young Ku

#2

Hi
You can only create imitated combo as test toolbar item
Here is a demo code of creation tree in a div same view as dhxCombo:

[code]

imitation tree 
<style>
    html, body {
        width: 100%;
        height: 100%;
        margin: 0px;
        overflow: hidden;
        background-color:white;
    }
</style>


<script>
    window.dhx_globalImgPath = "../dhtmlxCombo/codebase/imgs/";
    function doOnLoad(){
        document.getElementById("myImg").onclick = function(e){
            (e || event).cancelBubble = true;
            myTree();
        };
        document.getElementById("tree_1").onclick = function(e){

            (e||event).cancelBubble = true;
            if (mydiv.style.display == 'block'){
                mydiv.style.display = 'none';
            }
        };
    }
    var mydiv, tree2;
    function myTree(){
        if(typeof(mydiv) != "undefined"){
            showHideDiv();
            return false;
        }
        mydiv = document.createElement("div");
        mydiv.style.width = "150px";
        mydiv.style.height = "90px";
        mydiv.style.display = "block";
        mydiv.id = "mydiv";
        mydiv.position = "absolute";
        mydiv.style.border = "1px solid #191970";
        mydiv.style.paddingTop = "10px";
        document.getElementById('tree_1').appendChild( mydiv );

        tree2 = new dhtmlXTreeObject("mydiv","100%","100%",0);
        tree2.setSkin('dhx_skyblue');
        tree2.setImagePath("../dhtmlxtree_prof/codebase/imgs/csh_bluefolders/");
        tree2.setDataMode("json");
        tree2.loadJSONObject({
            id:'0', item:[
                {id: '01',  text: 'Item 1'},
                {id: '02', text: 'Item 2', item:[
                    {id: '021',  text: 'Item 2-1', open: '1'}
                ]},
                {id: '03',  text: 'Item 3'}
            ]});
        tree2.attachEvent("onClick", function(id){
            var text = tree2.getItemText(id);
            var div = document.getElementById("cont");
            div.innerHTML = text;
            mydiv.style.display = 'none';
        });
    }

    function showHideDiv(){
        var dis = mydiv.style.display;
        if (dis == 'block'){
            dis = 'none';
        }
        else {
            dis = 'block';
        }
        mydiv.style.display = dis;
    }
</script>
[/code]