现在领导又要增加功能,需要分页的时候,每页显示N条信息。由于是每个页面都要改,所有需要声明了一个扩展类代码如下:
// Copyright : 欧蓝德畅电子技术有限公司. All rights reserved.
// 文件名:pager.js
// 文件描述:分页扩展类,extJS控件之每页显示N条记录
//-----------------------------------------------------------------------------------
// 创建者:
// 创建时间:2013-06-21
//====================================================================================
Ext.define('Ext.ux.ComboPageSize', {
requires: [
'Ext.form.field.ComboBox'
],
pageSizes: [5, 10,15,20, 25, 50, 100, 200, 500, 1000],
constructor: function (config) {
if (config) {
Ext.apply(this, config);
}
},
init: function (pbar) {
var combo = Ext.widget('combo', {
store: this.pageSizes
, fieldLabel: '每页显示'
, labelWidth: 60
, width: 120
, listeners: {
change: function (s, v) {
pbar.store.pageSize = v;
pbar.store.loadPage(1);
}
}
});
var itemlengths = pbar.items.items;
pbar.add(itemlengths, '-', combo, '行');
combo.setValue(pbar.store.pageSize);
}
});
使用方法是:
bbar: Ext.create('Ext.PagingToolbar', {
plugins: [new Ext.ux.ComboPageSize({})],
store: Batchstore, //---grid panel的数据源
displayInfo: true,
displayMsg: '显示 {0} - {1} 条,共计 {2} 条',
emptyMsg: "没有数据"
}),
实现的效果图为: