View Full Version : Complex form

25 May 2010, 5:21 AM
Hello, is there a way to make a complex form like this:


Without use anchor layout on form and alot of panels with form layout?

Today i do so:

form({layout: 'anchor'}) {
fieldset({layout: 'column'}) {
panel({layout: 'form'}) {

xtype: 'form',
layout: 'anchor',
items: [
xtype: 'fieldset',
layout: 'column',
items: [
xtype: 'panel',
layout: 'form',
columnWidth: 0.7,
padding: 5,
labelWidth: 60,
items: [
xtype: 'textfield',

25 May 2010, 5:51 AM
Yes, that form can be created in the same fashion. You can change a FormPanel's or a FieldSet's layout to be anything you want, and add child Containers or Panels with their own layout. The FieldSet doesn't have a "flyout" menu (little gear icon) like other Containers do, but its layout config option can be located and modified in the Component Config pane.

25 May 2010, 7:54 AM
Sorry, i think didn't sure.

I mean about make that complex form without using one panel for each textfield.

If i use a column layout on a FieldSet my textField's lose the fieldLabel, so I made alot of panels to hand it, that panels have "form" layout to show fieldLabel's on textField's.

But that create many panels... Is there a way to make the fieldSet's layout = 'column' and show the textField's fieldLabel in that?

I've noticed just form layout show the textField fieldLabel, so made a column layout with many form layouts inside

25 May 2010, 8:01 AM

You have the right approach...although you can use a Container instead of a Panel, which is slightly less overhead and "simpler". But in order to show the fieldLabel, the Field must be directly inside of a "form" layout container. If you wish not to create Containers, you can always use a Label directly, placed next to a Field, and set its "forId". This would then ignore the fieldLabel of the Field as well as any label settings on the FieldSet/FormPanel.

26 May 2010, 6:35 AM
Thanks jarred =)

I will use containers instead of panels!