extjs - 在 EXTJS 4 中，如何在 NEXT PAGE 单击 pagingtoolbar 时添加额外的参数

Question

我使用 EXTJS 4.2.1。

这是我的数据存储。

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
 });

我在 ds 加载的地方添加了一些参数。

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

我在网格底部放了一个 pagintoolbar。

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

在第一页上一切正常，但是当单击下一页时，ds pramas 不会POST 到服务器。我调查来源。我找到这样的代码。

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

如何让PAGE NEXT如我所愿，希望大神指点。

Answer 1

如果您需要在每个请求中包含参数，您可以在代理配置中使用 extraParams 设置它们配置。

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

如果可以在请求之间更改额外参数的值，您可以在监听器中设置它们以通过代理进行存储前加载事件 setExtraParam方法:

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);
})