Question

I have trivial window:

   this.window = Ext.widget('window', {
            title: 'Find',
            closeAction: 'hide',
            width: 300,
            layout: 'fit',
            items: form
        });

with trivial form in it

var form = Ext.widget('form', {
    layout: {
        type: 'vbox',
        align: 'stretch'
    },
    border: false,
    bodyPadding: 10,

    items: [
        this.findInput,
    ]
});

which only has one item

    this.findInput = Ext.widget('textfield', {
        name: 'find'
    });

The issue is: how to set focus right after window is shown? I tried to call .focus() method of this.findInput in almost every window event handler with no luck.

Seems like even afterrender is called synchronously before DOM has created all the elements completely.

What have I missed? What event should I bind to to have all the elements rendered and able to accept the focus?

PS: if I call the same .focus() after small interval like 10ms – I get it focused, but it’s not a solution

Answer 1

Check out activeItem property – http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.Panel-cfg-activeItem

or you can also use defaultFocus: http://docs.sencha.com/ext-js/4-0/#!/api/Ext.window.Window-cfg-defaultFocus