Supply of a 'Store' to a Ext-JS Custom Panel not working -no data displayed

[Bill M]

Hi,

I have built a custom Panel, that I have extended from Ext.panel.Panel. I am trying to supply a Store to it via Ext.create.

var dataPanel= Ext.create('src.view.dataTabPanel', {dataTab_storeArg: dataTab_store});

The Store contents (dataTab_store) were loaded before the creation of this new component. Now, when I do this within the initComponent call in my custom Panel, I set store like this:

store: this.dataTab_storeArg

I have looked at the argument (object) with Firebug, and the data looks valid. However, the Panel is not displaying the contents of the Store. Now, I am not sure if I need to supply a requires of the class that contains the Store, following the class definition. Although, I've tried it and hasn't had any effect.

Like this:
Ext.define('src.view.dataTab_displayPanel', {
extend: 'Ext.panel.Panel',
requires: ['src.store.dataTab_transformStore;], <--- need this??

initComponent: function() {
...
...

Is there any sample code out there that explains how to do this? Or is this not possible without using MVC? I am not currently using it.

Thanks!

[evant]

Ext.panel.Panel doesn't accept a store, because it has no way to know how to display the contents.

In a view, you need to supply a template to tell it what fields to display.
In a grid, you need to supply columns to tell it how to extract the data.

For a panel, there's no such option, because the data is arbitrary.

[Bill M]

Hi Evant,

I made a mistake in what I had described above. I actually have created a 'Grid' that is extended from a 'Panel'. So, I am having trouble being able to pass a 'Store' into the component that I can then use as an argument to the 'store:' property.

Is there a way to do this? The Grid does not seem to display the contents from the 'Store'. I know the original code worked when I had it all in one file. But, I am trying to break it into components to avoid having a monster application.js file.

Thanks!

[evant]

You'll need to show the relevant code.

Typically you'd do something like this:

initComponent: function(){
    this.store = new Ext.data.Store({});
    // stuff
    this.callParent();
}

[Bill M]

Is it possible to pass an already created Store into the Component upon creation of the custom component (which is a Grid)?

I've been trying to do this, and the Store contents are not getting displayed in the Grid.

[evant]

Yes, however:

You'll need to show the relevant code.