I have been struggling with this and hopefully somebody can shed some light with my problem. I have an MVC ST2 app and I structured it this way:
app.js
Code:
...
controllers: ['Main', 'Module1'],
launch: function() {
Ext.Viewport.add(Ext.create('app.view.Main'));
}
...
view/Main.js
Code:
Ext.define("app.view.Main", {
extend: 'Ext.navigation.View',
config: {
id: 'root-view',
items: [
{
xtype: 'list',
id: 'homemenu',
...
}
]
...
}
....
Now I have two controllers to separate things up, since they look like modules to me. I have Main and Module1 controllers.
Code:
Ext.define('app.controller.Main', {
extend: 'Ext.app.Controller',
config: {
routes: {
'module1': 'loadModule1'
},
refs: {
homeNav: '#homemenu',
rootView: '#root-view'
},
control: {
homeNav: {
itemsingletap: 'homeClick'
}
}
},
homeClick: function(view, index, target, record, e, eOpts) {
if (record.get("name") == "Module 1") {
this.redirectTo('module1/home');
}
},
...
controller/Module1.js
Code:
Ext.define('app.controller.Module1', {
extend: 'Ext.app.Controller',
config: {
routes: {
'module1/home': 'showHome'
},
refs: {
homeNav: '#module1-homenav',
rootView: '#root-view'
},
control: {
homeNav: {
itemsingletap: 'homeClick'
}
}
},
showHome: function() {
this.getRootView().push(Ext.create('app.view.module1.Home', { id: '#module1-homenav' }));
},
homeClick: function(view, index, target, record, e, eOpts) {
console.log(record);
}
...
My problem is with the itemsingletap listener of 'homeNav' in Module1 controller. It's not executed, probably because it's dynamically inserted into the view after the controller has been initialized.
How can I make this work? Am I doing this the wrong way?