在EXTJS 4中,如何在NEXT PAGE点击pagingtoolbar时添加额外的参数

时间:2014-02-12 13:32:58

标签: extjs scroll-paging

我使用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
                }       
            })

我在网格的底部放了一个pagingtoolbar

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

在第一页上一切正常,但是当点击NEXT页面时,ds pramas不会POST到服务器。 我查看来源。我找到这样的代码。

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

如何使PAGE NEXT按照我的意愿工作,我希望有人给我一个提示。

2 个答案:

答案 0 :(得分:3)

应在商店的代理上设置将包含在每个请求中的任何参数。 你用的是什么代理? ajax代理具有属性“extraParams”。试一试。

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

答案 1 :(得分:3)

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

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

如果可以在请求之间更改额外参数的值,则可以通过代理setExtraParam方法在store aptload事件的侦听器中设置它们:

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