日期:2014-05-16  浏览次数:20286 次

ExtJS 分页扩展

最近工作项目需要,我也来扩展一下 ExtJs 分页.网上有很多..但没有找到项目要求的.

/**
?* @author LDJ
?* @date 2010-10-14 本分页组件提供 两个用户可以配置属性
?* @config everyPageCount 显示分页连接个数 默认为 11
?* @config everyPageSizeData 每页大小设置 为一个数组. 如 : [['5', 5], ['10', 10]]
?*
?* @type
?*/
Ext.namespace('Ext.ux.grid')
Ext.ux.grid.PagingToolbarExp = function(config) {
?var config = config || {};
?this.everyPageCount = config.everyPageCount || 7;
?this.everyPageSizeData = [ ['5', 5], ['10', 10], ['20', 20],
???['50', 50], ['100', 100]];
?if (config.everyPageSizeData) {
??Ext.apply(this.everyPageSizeData, config.everyPageSizeData);
?}
?Ext.ux.grid.PagingToolbarExp.superclass.constructor.call(this, config);
?this.initAction();
}

var T = Ext.Toolbar;
Ext.extend(Ext.ux.grid.PagingToolbarExp, Ext.PagingToolbar, {
?displayMsg : "显示 第 【{0}】 条到 【{1}】 条记录,一共 【{2}】 条",
?emptyMsg : "没有记录",
?beforePageText : '页码',
?afterPageText : '总页数【{0}】',
?firstText : '首页',
?prevText : '上一页',
?nextText : '下一页',
?lastText : '末页',
?refreshText : '刷新',
?initAction : function() {

?},
?initComponent : function() {
??var pagingItems = [this.first = new T.Button({
???????tooltip : this.firstText,
???????overflowText : this.firstText,
???????iconCls : 'x-tbar-page-first',
???????disabled : true,
???????handler : this.moveFirst,
???????scope : this
??????}), this.prev = new T.Button({
???????tooltip : this.prevText,
???????overflowText : this.prevText,
???????iconCls : 'x-tbar-page-prev',
???????disabled : true,
???????handler : this.movePrevious,
???????scope : this
??????}), '-', this.beforePageText,
????this.inputItem = new Ext.form.NumberField({
???????cls : 'x-tbar-page-number',
???????allowDecimals : false,
???????allowNegative : false,
???????enableKeyEvents : true,
???????selectOnFocus : true,
???????submitValue : false,
???????listeners : {
????????scope : this,
????????keydown : this.onPagingKeyDown,
????????blur : this.onPagingBlur
???????}
??????}), '-',
????'每页 ', this.pageSizeCombox = new Ext.form.ComboBox({
???????store : new Ext.data.SimpleStore({
??????????fields : ['text', 'value'],
??????????data : this.everyPageSizeData
?????????}),
???????mode : 'local',
???????displayField : 'text',
???????valueField : 'value',
???????editable : false,
???????scope : this,
???????allowBlank : false,
???????triggerAction : 'all',
???????value : this.pageSize,
???????listWidth : 45,
???????width : 45,
???????listeners : {
????????scope : this,
????????select : this.gotoSelectPage

???????}
??????}), ' 条', this.afterTextItem = new T.TextItem({
???????text : String.format(this.afterPageText, 1)
??????}), '-', this.next = new T.Button({
???????tooltip : this.nextText,
???????overflowText : this.nextText,
???????iconCls : 'x-tbar-page-next',
???????disabled : true,
???????handler : this.moveNext,
???????scope : this
??????}), this.last = new T.Button({
???????tooltip : this.lastText,
???????overflowText : this.lastText,
???????iconCls : 'x-tbar-page-last',
???????disabled : true,
???????handler : this.moveLast,
???????scope : this
??????}), '-', this.refresh = new T.Button({
???????tooltip : this.refreshText,
???????overflowText : this.refreshText,
???????iconCls : 'x-tbar-loading',
???????handler : this.doRefresh,
???????scope : this
??????}), '-', this.panelMe = new Ext.Panel({
???????id : 'pageBarItems',
???????html : this.pageSpliter()

??????})];

??var userItems = this.items || this.buttons || [];
??if (this.prependButtons) {
???this.items = userItems.concat(pagingItems);
??} else {
???this.items = pagingItems.concat(userItems);
??}
??delete this.buttons;
??if (this.displayInfo) {
???this.items.push('->');