EXTJS GRID and store

Question

I have EXT JS 4.2 Grid and store.

Now one page load grid get data from store and display on UI.

I have date drop down filter on page. on date selection of date filter one request should go to server fetch data from db and reload store with updated data, and grid should update with updated store value.

My issue is how can i unbind exiting store from grid load, set store params with date, then fetch new data in store and bind to grid. and show updated data on grid?

thanks in advance

this is code where grid is created , one button is created on click of which new params needs to pass to server

{
                xtype: 'container',
                layout: 'hbox',
                style: 'margin-left: 152px;',
                width: 960,
                height: 'auto',
                cls: 'portlet full',
                items: Ext.getCmp('grid')

            }, {  //Create Button to fetch Grid Checked Data//
            xtype: 'container',
            layout: 'hbox',
            style: 'margin-left: 163px;padding-top: 20px;padding-bottom: 59px;',
            items: [
                    Ext.create('Ext.Button', {
                    name: 'Click me',
                    width:'40px',
                    handler: function() {

update =============================================

        Ext.create('store', {storeId: 'storetest2'}).load({
        params: {
            // To send Extra Params
            'lastname':'test2'
        },
        callback: function(records, operation, success) {
            // To Perform some call back operations
        }
    });
    scndStore = Ext.data.StoreManager.lookup('storetest2'),
    Ext.getCmp('grid').reconfigure(scndStore);

update =============================================

               })
         ],

Dev Dev · Accepted Answer · 2014-01-30T12:43:43

After getting data into the new store,you can use

grid.reconfigure(store, [columns])

to change which store is bound to the grid..Please have a look docs.

A simple working fiddle

Update:Try this

var store2 = Ext.create('Ext.data.Store', {
               model : 'store2Model',   //Don't miss to mention model 
               storeId: 'storetest2',
               proxy : {
                         type : 'ajax',
                         url  :'someUrl'
                         reader : {
                                    type : 'json',
                                    root : 'items' // depends 
                                   }
                        }
             });
 store2.load({
    params: {
        // To send Extra Params
        'lastname':'test2'
    },
    callback: function(records, operation, success) {
        grid = Ext.getCmp('grid'); //First check whether you are getting this comp properly
        grid.reconfigure(store2);
    }
});

EXTJS GRID and store

2 Answers