Multi-columns

Hi,

i’m trying to implement a dhtmlxForm in a dhtmlxWindows control that is invoked when a user clicks on a register in a dhtmlxGrid.
At this moment it’s running correctly, except that i need to show a hugh amount of information in the form (about 56 fields), and i am not able to show it correctly in more than one column.
Is there a way to implement a multi-column or another view for the fields attached to the form different to a vertical list of inputs-textfields?

This is the code I use:

mygrid.attachEvent(“onRowSelect”,function(Id){
var data = [
{type:“settings”, position: “label-left”, labelWidth: 80, inputWidth: 120},
{type:“input”,id:“ALIAS”,name:“ALIAS”,label:“ALIAS”,value: mygrid.cells(Id,0).getValue()},{type:“input”,id:“DRAWING_NO”,name:“DRAWING_NO”,label:“DRAWING_NO”,value: mygrid.cells(Id,1).getValue()},
{type:“input”,id:“KEYWORD”,name:“KEYWORD”,label:“KEYWORD”,value: mygrid.cells(Id,2).getValue()},


];
var id = “Window”; //+winCount;
var dhxWins= new dhtmlXWindows();
dhxWins.setSkin(“dhx_skyblue”);
win = dhxWins.createWindow(id, 20, 20, 640, 700);
win.setModal(true);
win.setText("Work Order: “+mygrid.cells(Id,32).getValue()+” " +id);
win.denyResize();
win.centerOnScreen();
dhxForm = win.attachForm(data);

I tried the “inputWidth auto” but it doesn’t work.

Regards,
Eduardo.

In 2.6 version of dhtmlxForm multi-column mode is not available. But it is in 3.0 version.

You may download a beta version here: http://www.dhtmlx.com/x/download/regular/betas/dhtmlxForm_30b_110318.zip

In Form 3.0 there is an item type “newcolumn” which can help you easily create a needed mount of columns.

{type: "select", label: "SELECT", options:[ {value: "1", text: "*", selected: true}, {value: "2", text: "userId"}, {value: "3", text: "userName"} ]}, {type: "newcolumn"}, {type: "select", label: "FROM", options: [ {value: "1", text: "users", selected: true} ]},

Correct,

demo available here
dhtmlx.com/docs/products/dhtmlxF … olumn.html

Dear all,

thanks for the replies.

I tried to did the new column type, but it doesn’t run. First, i use the new libraries.

Then, i tried the following:

mygrid.attachEvent(“onRowSelect”,function(Id){
var data = [
{type:“settings”, position: “label-left”, labelWidth: 80, inputWidth: “auto”},
{type:“input”,id:“ALIAS”,name:“ALIAS”,label:“ALIAS”,value: mygrid.cells(Id,0).getValue(),readonly:“readonly”},
{type:“input”,id:“DRAWING_NO”,name:“DRAWING_NO”,label:“DRAWING_NO”,value: mygrid.cells(Id,1).getValue(),readonly:“readonly”},
{type:“newcolumn”},
{type:“button”,id:“UPDATE”,name:“UPDATE”,value:“Update”}
];

But it doesn’t run (it only creates a white space between DRAWING_NO and the update button, in the bottom of the form.

Then, i looked for the sample provided by Andrei, and i saw that it uses a list element, so i tried to implement it as following:
mygrid.attachEvent(“onRowSelect”,function(Id){
var data = [
{type:“input”,id:“SUPP-INSUL”,name:88,label:“SUPP-INSUL”,value: mygrid.cells(Id,88).getValue()},
{type: “label”,
list: [{
{type:“input”,id:“SUPP-MECH”,name:89,label:“SUPP-MECH”,value: mygrid.cells(Id,89).getValue()},
{type:“input”,id:“SUPP-MET”,name:90,label:“SUPP-MET”,value: mygrid.cells(Id,90).getValue()},
{type:“input”,id:“SUPP-SCAFF”,name:91,label:“SUPP-SCAFF”,value: mygrid.cells(Id,91).getValue()},
{type:“newcolumn”},
{type:“input”,id:“WP-CONF SPACE”,name:92,label:“WP-CONF SPACE”,value: mygrid.cells(Id,92).getValue()},
{type:“input”,id:“WP-HOT”,name:93,label:“WP-HOT”,value: mygrid.cells(Id,93).getValue()},
}]
},
{type:“button”,id:“UPDATE”,name:“UPDATE”,value:“Update”}
];

But it only throws a javascript exception: expected identifier string or number

Please, support me in this issue. Regards,
Eduardo.

Unfortunately the issue cannot be reconstructed.

If issue still occurs for you please provide the completed demo.
http://docs.dhtmlx.com/doku.php?id=others:how_to_create_the_completed_demo