Tap event not firing on nested components?

[Marc-QNX]

I'm having an issue where the 'tap' event is not firing on nested components.

For example, this works perfectly:


Ext.define('MyApp.view.Home', {
extend: 'Ext.Panel',
xtype: 'homeView',


config: {
fullscreen: true,
layout: 'fit',


items: [{
xtype: 'dataview',
itemTpl: '{label}',
store: 'Items',
scrollable: false,
listeners: {
itemtap: function (dataview, index, item, e)
{
alert('test');
}
}
}]


},


});

However, if I do the following, the event never triggers


Ext.define('MyApp.view.Home', {
extend: 'Ext.Panel',
xtype: 'homeView',

requires: [
'MyApp.view.home.HomeDataview'
],


config: {
fullscreen: true,
layout: 'fit',


items: [{
xtype: 'homedataview',
}]


},


});




Ext.define('MyApp.view.home.HomeDataview', {
extend: 'Ext.dataview.DataView',
xtype : 'homedataview',


config: {
xtype: 'dataview',
itemTpl: '{label}',
store: 'Items',
scrollable: false,
listeners: {
itemtap: function (dataview, index, item, e)
{
alert('test');
}
}
},


});

Am I missing something?

I also tried to do this from the controller via this.control() but no luck there either:


Ext.define('MyApp.controller.Home', {
extend: 'Ext.app.Controller',


views : [
'Home',
],


stores: [
'Items'
],


refs: [
{
ref : 'homeView',
selector: 'homeView',
xtype : 'homeView'
},
],


init: function() {
this.getHomeView().create();


this.control({
'homedataview': {
tap: this.onItemTap
},
});
},


onItemTap: function (dataview, index, item, e)
{
alert('test')'
}


});




Any thoughts?

[TommyMaintz]

You should not define listeners inline in the config object when defining your view. You either define them when creating an instance of your class (like you did in your first example), or when you use the MVC structure (recommended) you can use this.control. The reason your last example doesn't work is because you are using tap instead of itemtap.



Ext.define('MyApp.controller.Home', {
extend: 'Ext.app.Controller',

views : [
'Home',
],

stores: [
'Items'
],

refs: [
{
ref : 'homeView',
selector: 'homeView',
xtype : 'homeView'
},
],

init: function() {
this.getHomeView().create();

this.control({
'homedataview': {
itemtap: this.onItemTap
}
});
},

onItemTap: function (dataview, index, item, e) {
alert('test');
}
});

[Marc-QNX]

Hi Tommy.


You should not define listeners inline in the config object when defining your view. You either define them when creating an instance of your class (like you did in your first example),

Thanks for this.. since they were both done under config I didn't notice the difference until now.


or when you use the MVC structure (recommended) you can use this.control. The reason your last example doesn't work is because you are using tap instead of itemtap.

I have a personal problem with using this.control(). Although I understand the reason for it, I can't bring myself to use it as it requires the controller to have knowledge of the internal workings of the view -- which is in itself a contradiction to MVC. The entire point is to separate the view from the controller and, if in the future, I wish to change the view, I should not have to change the controller.

[TommyMaintz]

You should not think of a client-side MVC framework as if it is a server-side one. In a client-side app, all we want to do is listen for things happening on views (and other controllers) and react to it. The control method uses component queries, meaning that if the nesting/structure of your view changes, your queries will still work. This allows you to easily modify your views without having to update your controllers. I would fully agree with you if you meant that views should never be aware of controllers.

Trying to bring a server side architecture to the client side causes a lot of problems (we actually did this in the old MVC architecture in 1.1). I think you would find that if you gave the new MVC architecture a chance (including this.control, refs, firing application events instead of dispatching, etc), you would soon find out that it is much much more suitable for building rich client side apps.

[Marc-QNX]

I actually thought the 1.1 MVC was pretty good. Yes there are some problems, but there are ways around most of them. I agree that the view should not know the controller's architecture, and the application events are great for that.

Hopefully the MVC sessions at SenchaCon will clarify the new MVC a bit more and maybe some of these hesitations will go away.