ExtJs: which layout to choose for complex form with many fields
I need to implement a big complex form in extjs. This form contains about 20 lines with 5-6 fields on each line. There are textfields, combos and just displayfields in these lines.
I implemented it with 'form' layout for the parent panel. And with 'hbox' layout panels for each line. In order to display field labels, I have to wrap each field into a panel with form layout again. It even sounds scary, could you imaging this mess? I feel like I'm doing it wrong.
Need an advice on how to do it in a right way!
Updated: please check an example of开发者_高级运维 layout I'm trying to get.
I use layout: 'column'
quite a bit. Then you can tell each field how much of a columnWidth
each one should have. When the widths add up to over 1, the fields wrap to the next line.
For your screenshot, all of them are a column width of a third, so you could do something like this:
Ext.create('Ext.panel.Panel', {
layout: 'column',
defaults: {columnWidth: 0.3},
items: [{
xtype: 'textfield'
},{
...
}]
});
Instead of wrapping each row in panel
you can use built-in FieldContainer
widget (extjs4) or Ext.form.CompositeField
widget (extjs3).
精彩评论