CODEWITHSUNDEEP
extjs
user1234
user1234

Reputation: 3159

How to pass extra params to the store using the storeId

I want to access a param inside a store created. below is my store:

Q.define('test.DataStore', Ext.data.ArrayStore, function($supr){        
return {            constructor: function(cfg) {               
 $supr().constructor.call(this, {                    
storeId: 'DataRule',                    
data :[                           
['SEARCH', 'Search')],
 ['SEARCH2', 'Search2')],
  ['SEARCH3', 'Search3')],                    
]                
});            
}        
};    }
);

and here is how im accessing the store from:

items : this.section({
     items : [{                                                              
store: 'DataRule'  //using the store id defined in the store above                           },                           {                              xtype : 'box',                             
width : 10,         
 }]
}]

I want some params to be passed to the store, i.e [{id:'1'},{id: '2'}]. How can I pass params to be able to access inside the store?

Thanks!

Upvotes: 0

Views: 1413

Answers (1)

Christopher Badalucco
Christopher Badalucco

Reputation: 109

I made the assumption that you are using ExtJS6 and your goal is to filter the results via these parameters:

In your example you define the data up front. With that in mind you should be able to use the 'filter' method on the store:

// use filter method to filter the data on the front-end
 var myStore = Ext.create('Ext.data.Store', {
     model: 'User',
     data : [
         {id: '1', firstName: 'Peter',   lastName: 'Venkman'},
         {id: '2', firstName: 'Egon',    lastName: 'Spengler'},
         {id: '3', firstName: 'Ray',     lastName: 'Stantz'},
         {id: '4', firstName: 'Winston', lastName: 'Zeddemore'}
     ]
 });

 myStore.filter('id', '1');

 // making use of storeId
 Ext.getStore('myStore').filter('id', '1');

If you are requesting data from a server (e.g. through an ajax request) the simplest way to request data using params is by adding params on the load call:

Ext.define('User', {
         extend: 'Ext.data.Model',
         fields: [
             {name: 'id', type: 'string'},
             {name: 'firstName', type: 'string'},
             {name: 'lastName',  type: 'string'},
             {name: 'age',       type: 'int'},
             {name: 'eyeColor',  type: 'string'}
         ]
     });


     var myStore = Ext.create('Ext.data.Store', {
        storeId: 'myStore',
         model: 'User',
         proxy: {
             type: 'ajax',
             url: '/users.json',
             reader: {
                 type: 'json',
                 rootProperty: 'users'
             }
         },
         autoLoad: true
    });

    // adding params on load
    Ext.getStore('myStore').load({
        params: {id: '1'}
    });

If you want to automatically inject parameters for every load event, you can create a listener on the 'beforeload' event and add params:

Ext.define('User', {
     extend: 'Ext.data.Model',
     fields: [
         {name: 'id', type: 'string'},
         {name: 'firstName', type: 'string'},
         {name: 'lastName',  type: 'string'},
         {name: 'age',       type: 'int'},
         {name: 'eyeColor',  type: 'string'}
     ]
 });


 var myStore = Ext.create('Ext.data.Store', {
    storeId: 'myStore',
     model: 'User',
     proxy: {
         type: 'ajax',
         url: '/users.json',
         reader: {
             type: 'json',
             rootProperty: 'users'
         }
     },
     autoLoad: true,
     listeners: {
        // add params on every store load by injecting on the beforeload event
        beforeload: function(store, operation, eOpts) {
            operation.setParams({id: '1'});
        }
     }
 });
// the beforeload event kicks off our code to inject params
Ext.getStore('myStore').load();

Upvotes: 1

Related Questions