in EXTJS 4 , how to add extra params when NEXT PAGE clicked on pagingtoolbar

extjs, scroll-paging

Solution

If you need that parameters will be included on every request, you can set them in your proxy configuration with `extraParams` config.

proxy:{
      // ...
      extraParams: {
          'type': Ext.getCmp('type').value,  
          'city': Ext.getCmp('city').value,  
          'date': Ext.getCmp('date').value,
          'date1': Ext.getCmp('date1').value
      }
      // ...
},

If value of extra parameters can be changed between request you can set them in listener for store beforeload event by proxy `setExtraParam` method:

ds.on('beforeload', function() {
   var proxy = ds.getProxy();
   proxy.setExtraParam('type', Ext.getCmp('type').value);
   proxy.setExtraParam('city', Ext.getCmp('city').value);
   proxy.setExtraParam('date', Ext.getCmp('date').value);
   proxy.setExtraParam('date1', Ext.getCmp('date1').value);
})

Problem

I use EXTJS 4.2.1. Here is my DATA STORE. ``` Ext.define("user",{ extend:"Ext.data.Model", fields:[ {name:'mobile',type:'string',sortable:true}, {name:'name',type:'string',sortable:true}, {name:'month',type:'string',sortable:true}, {name:'city',type:'string',sortable:true}, {name:'mail_number',type:'string',sortable:true} ] }); var user = Ext.create("user",{}); var ds = Ext.create("Ext.data.Store",{ model:'user', storeId:'s_user', pageSize: 20, proxy:{ type:'ajax', timeout: 40000, url:'JSONServlet', reader:{ type:'json', root:'rows' }, writer:{ type:'json' } }, autoLoad:false }); ``` And i add some params where `ds` loads. ``` ds.load({ params:{start:0, limit:20, 'type': Ext.getCmp('type').value, 'city': Ext.getCmp('city').value, 'date': Ext.getCmp('date').value, 'date1': Ext.getCmp('date1').value } }) ``` I put a `pagingtoolbar` on the bottom of the grid. ``` var grid = Ext.create("Ext.grid.Panel",{ ... dockedItems :[{ xtype:'pagingtoolbar', store:Ext.data.StoreManager.lookup('s_user'), dock:'bottom', displayInfo:true }], ... store : Ext.data.StoreManager.lookup('s_user') } ``` On the first page everything is OK, but when NEXT page is clicked, `ds` pramas don't `POST` to server. I look into the source. I find code like this. ``` case "next": ds.load({params:{start: this.cursor+this.pageSize, limit: this.pageSize}}); break; ``` how to make PAGE NEXT work as i want, I hope someone give me a hint.

Original source