clint
clint

Reputation: 14524

ExtJS: Why isn't autosize working for my textfields?

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

Answers (1)

clint
clint

Reputation: 14524

Changing the layout to something other than the default 'anchor' solved the problem. Example:

enter image description here

I have a working example that anyone can try running if it's helpful: http://jsfiddle.net/clint_harris/5wzjG/

Upvotes: 3

Related Questions