Geek asks and answers

In EXTJS 4, how to add additional parameters when NEXT PAGE clicked on pagingtoolbar

I am using 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 parameters where it dsloads.

  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 pagingtoolbarthe 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')
  }

The first page is fine, but when the NEXT page is clicked, dspramas is not POSTon the server. I look at the source. I find such a code.

      case "next":  
                ds.load({params:{start: this.cursor+this.pageSize, limit: this.pageSize}});  
            break;

how to make PAGE NEXT work the way I want, I hope someone will tell me.

+3
source share
2 answers

If you need the parameters to be included in each request, you can set them in your proxy configuration using extraParamsconfig.

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

, beforelload 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);
})
+3

, , -. - ? - ajax "extraParams". .

proxy: {
    type: 'ajax',
    url: '...',
    extraParams: {type: '...',city: '...',date: '...',date1: '...'},
    ...
}
+3

More articles:


All Articles