Ext.grid 分页

1. 定义变量，存储，每页显示多少条数据

var itemsPage = 25;

2.grid数据源

//列表源
    var oStore = Ext.create('Ext.data.Store', {
        fields: ["a","b","c","d"],
        autoLoad: false,
        pageSize: itemsPage,　　//记录每页显示多少条数据，会作为url的参数传递
        proxy: {
            type: "ajax",
            url: "...",
　　　　　　　extraParams:{}, //自定义url参数
            reader: { type: 'json', root: "rows", totalProperty: 'total' }　　//totalProperty: 总数据条数
        }
    });

注意：获取到的数据源，格式为{total:123,rows:[......]}

3. 每页显示的条数，设为可选 //每頁顯示的條數

//每頁顯示的條數
var pagesizeCombo = new Ext.form.ComboBox({
    store: new Ext.data.SimpleStore({ fields: ['id', 'value'], data: [['25', 25], ['75', 75], ['100', 100], ['150', 150], ['200', 200], ['300', 300]] }),
    mode: 'local',
    displayField: 'id',
    valueField: 'value',
    width: 60,
    editable: false,
    listeners: {
        render: function (comboBox) {
            //使得下拉菜单的默认值是初始值
            comboBox.setValue(comboBox.ownerCt.getStore().pageSize);
        },
        select: function (comboBox) {
            var pSize = comboBox.getValue();
            comboBox.ownerCt.getStore().pageSize = parseInt(pSize);
            //存储改变后的，每页显示条数
            itemsPage = parseInt(pSize);
            //重置頁碼
            Ext.getCmp(gridId).getStore().currentPage = 1;
            //查詢加載數據
            oStore.reload();
        }
    }
});

4. grid显示的分页信息，给grid添加属性bbar

bbar: [{
    xtype: 'pagingtoolbar',
    dock: 'bottom',
    store: oStore,
    displayInfo: true,
    autoScroll: true,
    beforePageText: "第",
    afterPageText: "页  共 {0} 页",
    displayMsg: "显示 {0} - {1}条，共 {2} 条"),
    emptyMsg: "没有数据！"),
    items: ['-', "每页", pagesizeCombo, "条"]
}]

5. 如果是每页固定显示数据条数，可省略步骤1和3，其它步骤中出现的 itemsPage 和 pagesizeCombo 可直接将用数字替换掉。

6.  数据重新加载（或按条件重新查询数据），可以给url重新设定参数

oStore.reload({ params: { page: 1,a2:"xxx" } }

7. 设置页码可以

Ext.getCmp(gridId).getStore().currentPage = 1;

　也可以在reload中设置参数 {page:1}，也可以将页码设置成其他数字，看个人需求。