PDA

View Full Version : Form layout: want to put in non-form field headers betwen fields



Stoob
6 Jun 2008, 1:42 PM
Hello,

I have a form that consists of about 20 form.Checkbox fields.

I would like to do two things:

1) Put in a text header every four checkboxes.
For instance:

A first Group of Boxes
[ ] box 1 label
[ ] box 2 label
[ ] box 3 label
[ ] box 4 label
This is the next group of boxes
[ ] box 5 label
[ ] box 6 label
...etc...etc

2) I would like to (hopefully) split the checkboxes into two columns, 10 checkboxes (and subheaders) on the left and 10 on the right

How might I go about doing this?

Thanks!!!!

Stoob
6 Jun 2008, 2:01 PM
While we are at it, if you know how to put in a "check all" "uncheck all" thing please let me know.

GRACIAS

mcanthon
6 Jun 2008, 3:12 PM
Add a column layout with 2 columns inside your form panel, then inside the columns add field sets for your headers then the checkboxes inside the fieldsets.

Go to http://tof2k.com/ext/formbuilder/ and click the show/edit JSON button then paste in the following to see how it looks...


{
layout:"fit",
title:"FitLayout Container",
items:[{
xtype:"form",
title:"Form",
items:[{
layout:"column",
items:[{
columnWidth:0.5,
items:[{
xtype:"fieldset",
title:"Legend",
autoHeight:true,
items:[{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
},{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
}]
},{
xtype:"fieldset",
title:"Legend",
autoHeight:true,
items:[{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
},{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
}]
}]
},{
columnWidth:0.5,
items:[{
xtype:"fieldset",
title:"Legend",
autoHeight:true,
items:[{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
},{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
}]
}]
}]
}]
}]
}

Stoob
9 Jun 2008, 9:53 AM
Thanks but if this is the only way then ExtJS is ridiculous.

You mean the only way to put a couple of bold headers in a long list of checkboxes is to split it into different fieldsets?

Can't I just insert a phrase of text in the list of checkbox fields?

Anyone else?

nicklepedde
9 Jun 2008, 10:32 AM
You could try something like this:



{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
},{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
},{
html:"<b>Section Head</b>",
border:false
},{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
},{
xtype:"checkbox",
fieldLabel:"Label",
boxLabel:"Box label",
name:"checkbox",
inputValue:"cbvalue"
}