PDA

View Full Version : How catch TreeStore events in Controller



GuillaumeF
24 Aug 2012, 12:58 AM
Hi,

Using ExtJS4.1, I create a TreeStore during the initComponent() of a TreePanel.
How can I catch the TreeStore events from a controller ?

See below my code that doesn't work.

Regards,

Guillaume

VIEW :
Ext.define('Link.view.module.ContainersTree', {
extend: 'Ext.tree.Panel',
alias: 'widget.ModuleContainersTree',

initComponent: function() {
this.store = Ext.create('Ext.data.TreeStore', {
model: 'Link.model.Container',
}
[......]

CONTROLLER :
Ext.define('Link.controller.module.Edit', {
extend: 'Ext.app.Controller',

views: [ 'module.ContainersTree' ],

models: [
'Container'
],

init: function() {
this.control({
'ModuleContainersTree': {
select: this.onTreeSelect // Tree Panel event ok.
},

'ModuleContainersTree tree': {
append: function() { // Can't catch TreeStore event :(
alert('load');
}
}

[.......]

vietits
24 Aug 2012, 1:31 AM
You can catch events from components only. Ext.data.TreeStore is not a component so you can not catch its event as you do with components. However, you can use fireEvent or relayEvents to fire or to relay its event from a component. Example:



Ext.define('Link.view.module.ContainersTree', {
extend: 'Ext.tree.Panel',
alias: 'widget.ModuleContainersTree',


initComponent: function() {
this.store = Ext.create('Ext.data.TreeStore', {
model: 'Link.model.Container',
...
});
this.relayEvents(this.store, ['load'], 'store'); // relay store 'load' event as 'storeload'
...
}
});



Ext.define('Link.controller.module.Edit', {
extend: 'Ext.app.Controller',


views: [ 'module.ContainersTree' ],


models: [
'Container'
],


init: function() {
this.control({
'ModuleContainersTree': {
select: this.onTreeSelect, // Tree Panel event ok.
storeload: this.onStoreLoad
},
[.......]

GuillaumeF
24 Aug 2012, 1:54 AM
It works.

Very clear, very great.

Thank you !