Scope: can't capture events from a Store in a ViewController

[mlhotellerie]

I'm working on a very simple panel with a ViewController. I'm not able to capture the events of my store into the controller, the scope of the store's events are the store itself.


Ext.define('MyApp.view.TestPanelViewController', {
extend: 'Ext.app.ViewController',
alias: 'controller.testpanel',
onLoad: function (comp, records, successful, eOpts) {
console.log('beforeload event');
}
});

Ext.define('MyApp.view.TestPanel', {
extend: 'Ext.grid.Panel',
alias: 'widget.testpanel',
defaultListenerScope: true,
store: {
autoLoad: true,
listeners: {
beforeload: function () {
console.log('beforeload event');
},
load: 'onLoad'
}
},
controller: 'testpanel'
});

The output is :

beforeload event
[E] No such method onLoad on Ext.data.Store

Store's scope work differently than components ?

According to this post (http://www.sencha.com/forum/showthread.php?284847-Where-do-you-define-listeners-for-the-view-which-references-the-ViewController)(and what I understood of ViewController) listeners of the View usually correctly find the 'top controller' from string events.

thanks

[mitchellsimoens]

A ViewController is for views, a store is not a view so the binding is not there. You can use a ViewModel to instantiate and hold your store and your controller can get access to it. You can bubble store events from your view to your controller.