Ext表格自定義分頁大小 插件

代碼如下：

 1 /*
 2  * Ext表格自定義分頁大小 插件
 3  * 
 4  * 示例PagingToolbar
 5     brr = new Ext.ux.PagingToolbar({
 6                 plugins: new Ext.ui.plugins.ComboPageSize(),
 7                 pageSize : 25,
 8                 store : ds,
 9                 displayInfo : true,
10                 displayMsg : '顯示第 {0} 條到 {1} 條記錄，一共 {2} 條',
11                 emptyMsg : "沒有記錄"
12     });
13     示例查詢
14     ds.load({
15          params : Ext.apply({
16                      start : 0,
17                      limit : brr.pageSize
18              },dsx.baseParams)
19      });
20  * 
21  */
22 Ext.namespace('Ext.ui.plugins');
23 
24 Ext.ui.plugins.ComboPageSize = function(config) {
25     Ext.apply(this, config);
26 };
27 
28 Ext.extend(Ext.ui.plugins.ComboPageSize, Ext.util.Observable, {
29 
30     pageSizes: [15, 20, 50, 100],
31     prefixText: '每頁顯示',
32     postfixText: '條',
33     addToItem: true,    //true添加到items中去，配合index；false則直接添加到最後
34     index: 8,           //在items中的位置
35     init: function(pagingToolbar) {
36         var ps = this.pageSizes;
37         var combo = new Ext.form.ComboBox({
38             typeAhead: true,
39             triggerAction: 'all',
40             lazyRender: true,
41             mode: 'local',
42             width: 50,
43             store: ps,
44             enableKeyEvents: true,
45             editable: false,
46             loadPages: function() {
47                 var rowIndex = 0;
48                 var gp = pagingToolbar.findParentBy(
49                                 function(ct, cmp) { return (ct instanceof Ext.grid.GridPanel) ? true : false; }
50                               );
51                 var sm = gp.getSelectionModel();
52                 if (undefined != sm && sm.hasSelection()) {
53                     if (sm instanceof Ext.grid.RowSelectionModel) {
54                         rowIndex = gp.store.indexOf(sm.getSelected());
55                     } else if (sm instanceof Ext.grid.CellSelectionModel) {
56                         rowIndex = sm.getSelectedCell()[0];
57                     }
58                 }
59                 rowIndex += pagingToolbar.cursor;
60                 pagingToolbar.doLoad(Math.floor(rowIndex / pagingToolbar.pageSize) * pagingToolbar.pageSize);
61             },
62             listeners: {
63                 select: function(c, r, i) {//select和blur事件不可共存
64                     pagingToolbar.pageSize = ps[i];
65                     myPageSize = ps[i] ;
66                     this.loadPages();
67                 }
68             }
69         });
70         if (this.addToItem) {
71             var inputIndex = this.index;
72             if (inputIndex > pagingToolbar.items.length) inputIndex = pagingToolbar.items.length;
73             pagingToolbar.insert(++inputIndex, '-');
74             pagingToolbar.insert(++inputIndex, this.prefixText);
75             pagingToolbar.insert(++inputIndex, combo);
76             pagingToolbar.insert(++inputIndex, this.postfixText);
77         }
78         else {
79             pagingToolbar.add('-');
80             pagingToolbar.add(this.prefixText);
81             pagingToolbar.add(combo);
82             pagingToolbar.add(this.postfixText);
83         }
84         pagingToolbar.on({
85             beforedestroy: function() {
86                 combo.destroy();
87             },
88             change: function() {
89                 combo.setValue(pagingToolbar.pageSize);
90             }
91         });
92 
93     }
94 });

效果圖：