Multi-columns

Suite and Optimus Suite 5
#1

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.

#2

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} ]},

#3

Correct,

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

#4

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.

#5

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