ExtJS 4 Change grid store on the fly

Question

Is it posible to change grid\'s store in ExtJS 4?

For example, i have two models:

User = Ext.define(\'User\',{
  extend: \'Ext.data.Model\',
  [...],
  h         


        

Answer 1

You are looking at stores the wrong way. A store is attached to the grid forever, hence there is no grid.setStore(). You do NOT change a store for a grid, instead you change the DATA in the store for that grid.

Now, solution to your problem: You are correct with the part that you already have a instance of store with your data. ie; user.products(). Still, you will have to create a store for your grid. This store will not have any data though. Now, when you need to display products information, you need to load the grid's store with data. You can use:

• load()
• loadData()
• loadRecord()

to load data into your store. In your case, you can do the following:

myStore = user.products();
grid.getStore().loadRecords(myStore.getRange(0,myStore.getCount()),{addRecords: false});

Answer 2

I think a better solution would be to :

     grid1.on('itemclick', function(view, record) {
         grid2.reconfigure(record.products());
     );

Answer 3

Abdel Olakara's answer helped me out when I needed to update data on something that didn't have reconfigure (custom class inheriting from Ext.form.FieldSet).

But you don't need to specify addRecords or the range for getRange, because the defaults have us covered in this case.

This means you can do:

myStore = user.products();
grid.getStore().loadRecords(myStore.getRange());

Answer 4

If you want to attach a store to a grid after the grid has been created, you can use the bindStore() method.

var store = user.products();
grid.getView().bindStore(store);

Alternatively you can also use load(), loadData(), loadRecords() methods, and copy the data into your store.