View Full Version : Making new instance of a Store

20 Feb 2012, 4:26 PM
Dear All,

I'm not sure if I should post this question here or ExtJS4 forum, if this is not the place please let me know.. I am trying to create simple form panel using designer, and trying to -create- new store from store definition for treepanel (store def already made from designer) each time I create the form.

From designer I can select the store for treepanel and all working however I am not sure how I can tell designer to create new store (instance) each time since I can't modify implementation class. As you can see, I'm new to ExtJS, Javascript, MVC.

Where would I say something like..

var store = Ext.create('somestore').. OR how do I use designer so that it will be effectively like:

xtype: 'treepanel',
itemId: 'CategoryTree',
collapsed: false,
store: Ext.create('somestore'), (instead of 'somestore')
viewConfig: {
rootVisible: false

If I change from store property of designer, it comes as store: 'Ext.create(\'somestore\')', instead..

I'm trying to do all this just using designer 2.0 without hand modifying the source codes (which.. designer 2.0 overwrites).. if at all possible.

Would I be doing such thing using controllers? or events?

Thank you!

21 Feb 2012, 5:20 AM
I somehow to got using controller...

I think it will better describe what I'm trying to do.

if(tab) {

} else {
console.log('not found!');

var product = Ext.create('Sample.view.ProductForm', {
title: tabName,
closable: true

var test = product.down('treepanel > dataview');
var store = Ext.create('Sample.store.StoresCategories');



tab = panel.add(product);

ProductForm is a tabpanel which has form and inside of this form there is treepanel for selecting categories. There is also StoresCategories defined but I want to create new instance of store (as oppose to one I selected from designer as config value). Because whenever I am clicking a treenode, other treepanel reacts to click action instead of one that is clicked. I am guessing it's because of using same store...

Any pointers will be very appreciated!

21 Feb 2012, 7:54 AM
While I am trying everything I could try, I found just creating new store instance by

var whateverstore = Ext.create('Sample.store.StoresCategories');

just before I create the form (with tree), seems like making it to use newly created store. (without adding whateverstore anywhere). Now clicking the node does not affect other treepanel that's using SotresCategories.

var whateverstore = Ext.create('Sample.store.StoresCategories');

var product = Ext.create('Sample.view.ProductForm', {
title: tabName,
closable: true

I have no idea but seems like Form (with tree) is using -last- created instance of StoresCategories?

I can work with this but is this right way of using it or will it continuously make stores until memory fills up as I use the application and make and destroy forms?


21 Feb 2012, 6:37 PM
You've raised a lot of good points here that we are discussing internally before giving you response.

Just want to make sure you don't feel neglected ;)

28 Apr 2012, 6:31 AM
As a user who follows this thread, it's been more than a month since the last post on this thread whilst both Sencha Architect and ExtJS have gone under major releases (Sencha Architect 2 and ExtJS 4.1 are out now) and I wonder if this issue has been addressed in any of the releases.
I've had the same problem with Sencha Architect for a while now. It doesn't support inline stores. One can not instantiate a new store for a component which means using global stores are mandatory. As for the grids it's possible to replace their store later (programmatically) using "reconfigure" method but trees do not have such a method! And thus it's a deadlock.
Please let us know if any solution is made available.


29 Sep 2012, 1:47 PM
Well, I guess we are neglected here with this problem. I'm prototyping ExtJS application (4.1 + Architect 2).
We will most likely not use Architect at all, but now, it looked like a good idea to keep app organized as Architect wants it just to make it right MVC.

I have the same situation, where I want to add several tree panels to the same application view. Each works the same way, so they could use the same controller with view context. But each is using different data, that might contain the same objects arranged in different way. Since we would have one controller instance, I would have to create Store instance in each view instance. In Architect I can only select store from class list. There is no way to add store creation to initComponent (or I can't see how) and I guess that is very good place to do that.

Second option would be to add Ext.create to "store"?

Not everybody lives in a perfect world, where we have one simple view with one "products" list and static layout :)

28 Jan 2013, 12:30 PM
I too like to have { store: Ext.create() } available in Architect

28 Jan 2013, 12:51 PM
It's on the list of thigns to look at but hasnt gotten the attention it needs.

We will look at it after the 2.2 release.

28 Jan 2013, 1:55 PM
var row = panel.items.getByKey('myshipping' + record.raw.id);
if(row) {
closable: true,
xtype: "MyShipping",
id: 'myshipping' + record.raw.id,
title: record.raw.shopTitle + ' - Versandart'
Ext.getCmp('myshipping' + record.raw.id).reconfigure(Ext.create('MyApp.store.MyShippingStore'));
Ext.getCmp('myshipping' + record.raw.id).store.proxy.extraParams.shopId = record.raw.shop;
Ext.getCmp('myshipping' + record.raw.id).store.load();

4 Oct 2013, 6:11 PM
Has this issue been addressed in Sencha Architect 3?

I too have a need for each new instance of a form (that contains embedded grids) that I instantiate to get its own instantiated COPIES of the stores the grids use. I am instantiating a form and adding it as a tab in a tab panel. I can add any number of the same form to the tab panel. Each form will contain a unique set of data so they cannot use the same copies of the stores.

18 Oct 2013, 2:02 AM
Same problem here.

I have a window showing invoice details, containing a "payment" grid, and a payment store.

When I create two instances of that window class (say you want to compare two invoices side by side) both grids links to the same store, wich is wrong because editing one change even the other.

I belive a "link" store option would be optimal so that it creates a new istance of the store.

The cleanest solution is to create an override I belive, but I'm missing something because the following
code in the grid override does not work.

store: Ext.create('APP.store.storeToCopy')

Any suggestions?

20 Oct 2013, 6:00 PM
This is still something we need to resolve and will not occur in 3.0.0.

An override/processConfig/init will work but you need to make sure that the store is created when the application is loaded rather than at class definition time.

21 Oct 2013, 12:21 AM
This is still something we need to resolve and will not occur in 3.0.0.

An override/processConfig/init will work but you need to make sure that the store is created when the application is loaded rather than at class definition time.

Thank you.

It turned out my problem was the proxy defined at model level, wich I was adding extraParams to.
Multiple istances of a store needs multiple instances of the proxy too.

6 Sep 2014, 2:58 AM

We are in the process of evaluating Architect to use for a port of our application to the web. However, it simply will not work unless our objects can have their own stores as we create multiple instances of the objects and show them as tab pages. This seems like a pretty basic need. The fact that it has not been addressed for so long makes me hesitate to move forward with the evaluation.

Has a fix to this issue been slated for a future release?

Would I be able to accomplish what I need if I were to work outside of Architect?
An earlier post mentions using an override. Will you please post an example of this?

Thank You

6 Sep 2014, 4:35 AM
You can use the `Process Config` feature of the Architect and assign a newly created store / any custom config to a component created by Architect. Here's an example for store:

config.store = new Ext.data.JsonStore({
fields: [
name: "id",
type: "int"
name: "name",
type: "string"
return config;

It can also be a store's config instead of it's actual object, whichever suits you.

The only downside of this solution is that Architect won't recognize it and thus it won't be shown while you are designing. Otherwise it's a perfect solution.

6 Sep 2014, 9:02 PM
Thank you for that Mehran.
That has gotten me further.