Layout with toolbar

Suite and Optimus Suite 6
#1

I am new to dhtmlx 6. How can I attach a toolbar to a layout? I have the following code but it doesn’t work:

    var qLayout = new dhx.Layout("dBody", {
        cols: [
            {
                id: "c",
                //width: "200",
                gravity: false,
                css: "dhx_widget--border_top dhx_widget--border-shadow"
            },
            {
                id: "d",
                header: "",
                css: "dhx_widget--border_top dhx_widget--border-shadow",
                rows: [
                    {
                        id: "a",
                        height: "90px",
                        gravity: false,
                        padding: 0,
                        css: "dhx_widget--border_top dhx_widget--border-shadow class-cabecera",
                    },
                    {
                        id: "b",
                        css: "dhx_widget--border_top dhx_widget--border-shadow"
                    },
                ]    
                
            }
        ],
    });

oHeader = qLayout.cell("a");
    oHeader.attachHTML('<div id="dToolbar"></div>');
    qToolbar = new dhx.Toolbar('dToolbar'); 
    var data = [
        {
            type: "button",
            icon: "dxi-plus",
            value: "new"
        },
        {
            type: "button",
            icon: "dxi-folder-open",
            value: "open"
        },
        {
            type: "button",
            icon: "dxi-vault",
            value: "save"
        },
        {
            type: "button",
            icon: "dxi-delete",
            value: "delete"
        }
    ];
    qToolbar.data.parse(data);
#2

You don’t need to do the attachHTML on oHeader. Using your same definitions for qLayout and data.

qToolbar = new dhx.Toolbar(); 
qToolbar.data.parse(data);
qLayout.cell("a").attach(qToolbar);
1 Like