PDA

View Full Version : How to align a comboBox under the fieldlabel?



guyza
21 Sep 2010, 9:34 AM
Is there a way to align a comboBox directly under its fieldlabel? I'm trying to do something that looks like the textfield and label alignments in form 5 of the examples located here: http://dev.sencha.com/deploy/dev/examples/form/dynamic.html

No matter which layout I use, I can't seem to get this to work. Here is an excerpt from my code:


var filtersGroup = {
frame: true,
title: 'Form Filters',
width: util.getWindowWidth() * .20,
autoHeight: true,
items: [{
layout: 'column',
border: false,
items:[{
columnWidth: 1.0,
border: false,
layout: 'form',
items: [{
xtype: "checkbox",
fieldLabel: "Label 1",
//anchor: "0%",
name: 'cb-col-1',
checked: true,
listeners: {
check: function(box, msg) {
checkBoxListener(box, msg);
}
}
},
{
xtype: "checkbox",
fieldLabel: "Label 2",
//anchor: "0%",
name: 'cb-col-2',
checked: true,
listeners: {
check: function(box, msg) {
checkBoxListener(box, msg);
}
}
},{
xtype:'combo',
fieldLabel: "Combo Label",
name: 'cb-col-3',
store: datastore,
data: datastore.collect("parent"),
displayField:'parent',
typeAhead: true,
anchor: "98%",
width: 100,
mode: 'local',
forceSelection: true,
triggerAction: 'all',
emptyText:'ALL',
selectOnFocus:true
}
]
}]
}]
}

troseberry
21 Sep 2010, 10:37 AM
set the labelAlign config for the FormPanel

labelAlign: 'top',

guyza
22 Sep 2010, 12:31 PM
Thanks troseberry,

I had been trying to use the labelAlign property and came to discover that it only applies to child containers. Once I added it to my parent container/panel, all was well.