setActiveItem doesn't work from panel sencha - sencha-touch

Question

I have a list in tab panel and i added onItemDisclosure which supposed to switch to an into page (inside the tab panel).
The setActiveItem does not work, and the error I got is that: [undefined] is not a function.
Code:
Toolbar.views.listPanel = Ext.extend(Ext.List,{
id:'mylist',
store:ListStore,
itemTpl: '<div class="stores"><b>{name}</b><br/><p style="font-size:small">{address}{distance}Km</p></div>',
//grouped:true,
onItemDisclosure: function(){
//Ext.Msg.alert("closure works!");
//Toolbar.views.detailPanel.update();
//alert(Toolbar.views.detailPanel);
Toolbar.views.Searchcard.setActiveItem(Toolbar.views.detailPanel,{type:'slide',direction:'left'});
}
});
The panel to switch to:
Toolbar.views.detailPanel = Ext.extend(Ext.Panel,{
id:'detailpanel',
tpl:'Hello!'
});
Ext.reg('searchcard', Toolbar.views.Searchcard);
Ext.reg('listPanel', Toolbar.views.listPanel);
Ext.reg('detailPanel', Toolbar.views.detailPanel);
Thanks in advance,

Answer 1

The problem is you're referencing the class not the instance of the Searchcard. You have to reference it using a component query.
Generally it follows this way:
masterComponent.getComponent('your_component_itemID');
Or you can use panel.query(selector)
http://docs.sencha.com/touch/1-1/#!/api/Ext.Panel-method-query
Really instead of just hacking it through have a look at this article:
http://www.sencha.com/learn/a-sencha-touch-mvc-application-with-phonegap/