PDA

View Full Version : How set focus to an item after setting layout to active?



steve25
14 Oct 2013, 6:17 AM
I have created a viewport with card layout as below:
The xtype contains components including a form (indirectly) with textfields.

Ext.define('App.view.Viewport', {
extend:'Ext.container.Viewport',
requires:[

'App.view.Login'
],
layout:'card',
id:'viewport',
activeItem:0,
items:[
{
id:'card-0',
xtype: 'view.Login'
}
]


});

I would like to be able to set the focus on a textfield in the form
following setting the viewport's item to active.

i.e. following
var lay = Ext.getCmp('viewport').getLayout();
lay.setActiveItem(0);

I could do e.g. the following (which seems to work):
Ext.getCmp('username').focus('', 10);

One problem with this is that I have to invoke the above in several places
in the code.

I would like to know if there is a listener for example that could
be placed on the username textfield following the (form) item being set to
active, similar to e.g. afterRender.i.e. so that the component itself
knows to set focus following being set to active?

ettavolt
14 Oct 2013, 9:13 AM
Take a look on hierarachyEventSource (http://docs.sencha.com/extjs/4.2.2/source/Component6.html#Ext-Component-method-fireHierarchyEvent). Components fire show/hide for it.