how to include a tabbar in a form with container



I’m new with dhtmlx and I don’t understand the way to include a tabbar or a grid with a container in a form

Here are my pieces of code :

A function “createclient” in charge to show a window with a form to get clients information :

[code]function createClient() {
dhxWins = new dhtmlXWindows();
detailWin = dhxWins.createWindow(“detailWin”, 80, 80, 790, 320);
detailWin.setText(“Création d’un nouveau client”);
detailForm = detailWin.attachForm();

tabaddress = new dhtmlXTabBar(detailForm.getContainer("myContainer"));
tabaddress.addTab("a1", "Tab 1-1");
tabaddress.addTab("a2", "Tab 1-2");
tabaddress.addTab("a3", "Tab 1-3");

a testclient.json file to load the structure of the form :

[ {type: "settings", position: "label-left", labelWidth: 90, inputWidth: 130}, {type: "input", label: "Nom", value: "", name: "Nom"}, {type: "container", label: "Adresses", value: "Testi", name: "myContainer", inputWidth: "500", inputHeight: "300"} ]

It’s simplified for testing.

What I’m doing wrong because the label is shown but nothing else.

Thanks for your help


hi, this is an example of a tabbar and grid with containers
I hope it can help you

{_idd: “175”, type: “block”, width: “auto”, offsetTop: “0”, blockOffset: “0”, list: [
{_idd: “2900”, type: “container”, value: “”, name: “scheda”, inputWidth: “1112”, inputHeight: “315”, offsetTop: “0”}

let form_ana = tabbarclie.cells(‘tab_1’).attachForm(str);
tabscheda = new dhtmlXTabBar(form_ana.getContainer(‘scheda’));

    let tab_fs = tabscheda.cells('tab_1');

let str=[
{_idd: “413”, type: “block”, width: “auto”, blockOffset: 0, offsetTop: 10, list: [
{type: “settings”, position: “label-left”, labelWidth: 80, inputWidth: 130},
{_idd: “416”, type: “container”, label: “”, name: “grid”, inputWidth: 500, inputHeight: 220, offsetLeft: 0, offsetTop: 0},
{_idd: “417”, type: “newcolumn”},

let grid_pass = new dhtmlXGridObject(form_pass.getContainer(‘grid’));
grid_pass.attachEvent(“onRowSelect”, function(rId,cInd){


Pleas,e try to use the callback function for your form structure loading:
tabaddress = new dhtmlXTabBar(detailForm.getContainer(“myContainer”));
tabaddress.addTab(“a1”, “Tab 1-1”);
tabaddress.addTab(“a2”, “Tab 1-2”);
tabaddress.addTab(“a3”, “Tab 1-3”);


Thank’s Sematik for your help.

Is it the same thing for a grid ? Do I need to use a callback function ?
Can I put in the same form a tabbar and a grid ?


Yes, you need to use the same approach.
You may include the grid and the tabbar in the same form. just make sure that they have different containers.