Grid instances

Hi ,

I m using Ext JS v4.2.1 . I have and MVC App.

I have defined a grid :

Ext.define('Inc.view.details.Grid' ,{

extend: 'Ext.grid.Panel',

requires : ['Ext.ux.grid.FiltersFeature','Ext.data.Store','Ext.ux.ProgressBarPager'],

alias: 'widget.incgrid',

store : Ext.create('Ext.data.Store', {

fields: [],

data : []

}),

stripeRows: true,

forceFit : true,

remoteSort : true,

dockedItems : [{

xtype: 'pagingtoolbar',

store : Ext.create('Ext.data.Store', {

fields: [],

data : []

}),

dock: 'bottom',

displayInfo: true,

plugins: Ext.create('Ext.ux.ProgressBarPager', {})

}],

features: [{

ftype: 'filters',

encode : true,

local: false

}],

initComponent: function(){

Ext.apply(this, {

tbar : [{

text: Inc.utils.Utils.loadMessage().add,

action : 'addrecord',

iconCls : 'inc-grid-add'

}],

columns : [],

viewConfig: {

emptyText: Inc.utils.Utils.loadMessage().emptyRecords

}

});

this.callParent();

}

});

and I load this in multiple regions of viewport and bind with different stores:

[{ "region" : "center",

"flex" : 1,

"xtype" : "incgrid"

},{

"region" : "east",

"flex" : 1

"xtype" : "incgrid"

}]

But when I reconfigure one of the grids , all of them seems to get reconfigured.

Should I define as many grids as required??