ExtJS 4 - How to access multiple stores from views in MVC?

I am trying to build a app in extjs 4 using the new MVC method approach. I have a grid where the user can click on a row and the editing is done Ext.window.

This Ext.window with tabs is defined in the controller as a view. I am having problems with 2 things:

---

1) The window has 2 grids, which I would like to have populated from a store, when the tab is c开发者_Go百科licked. When defining the grid's store, I cannot access it even though it was denied in my controller. I tried

...
xtype:'grid',
store:MyApp.store.Products
columns:[..]
...

but no luck!

Also tried to define multiple stores for the view:

Ext.define('MyApp.view.Edit', {
    extend:'Ext.window.Window',
    store:['Products','Countries']
...

But also no luck. If I have only ONE store defined in the view, I can access it with this.Countries for example.

---

2) My second question is partly related. The Ext.window is a form getting populated with data from the grid row that was clicked.

How can I populate one of the grids in the Ext.window form with the data that was pushed to it? Should it have an empty store by default and then have a listener on the tabclick? Or can I just push a data object into it?

Any help is appreciated.

---

To answer your first question, you need to reference your stores in the controller. You could do something like this in your controller

stores  : ['Products', 'Countries'],

models  : ['Products', 'Countries'],

refs: [
    {ref: 'mytabpanel', selector: 'mytabs'}
],

 init: function() {
    this.control({
        'mytabs': {
            tabchange       : this.loadTabData
        },

     //create a onProductsStoreLoad method to handle stuff
     this.getProductsStore().on({
        scope: this,
        load : this.onProductsStoreLoad
    });


loadTabData: function() {
   var activeTab = this.getMytabpanel().getActiveTab();
   //Do whatever you need
}