Reputation: 14524
I have a FormPanel (Ext.form.Panel) with text fields; I'd like the text fields to automatically resize so that their entire contents are visible, but the following isn't working:
Ext.define('myapp.view.admin.EditUserFormPanel', {
extend: 'Ext.form.Panel',
initComponent: function() {
var me = this;
me.items = [
{
xtype: 'textfield',
fieldLabel: 'OpenID',
name: 'openid',
grow: true,
listeners: {
autosize: function(newWidth) {
console.log(newWidth);
},
focus: function(txtField) {
console.log('focus fired');
txtField.autoSize();
}
}
}
];
me.callParent();
}
});
Both of my event handlers fire. However, autosize only fires when the form is rendered; not when I try to manually call autoSize().
Any ideas?
Upvotes: 1
Views: 1600
Reputation: 14524
Changing the layout to something other than the default 'anchor' solved the problem. Example:
I have a working example that anyone can try running if it's helpful: http://jsfiddle.net/clint_harris/5wzjG/
Upvotes: 3