【IT168技术文档】在Ext的原有分页控件中，服务器端方法是根据传入的起始数据记录号(start)，和显示多少条记录(limit)来返回当前页记录的。有时候我们经常是根据当前页码(pageIndex)，和每页显示记录数(pageSize)来获取当前页数据，下面就是我根据需要自己写的一个对Ext.PagingToolbar的扩展：Ext.PagingToolbarExt。

/**
2 * @author Terry
3 */
4
5Ext.PagingToolbarEx = Ext.extend(Ext.PagingToolbar, {
6    afterPageText: '/ {0}',
7    beforePageText: '页',
8    displayInfo: true,
9    displayMsg: '显示 {0} - {1} / {2}',
10    emptyMsg: '没有数据',
11    firstText: '第一页',
12    prevText: '前一页',
13    nextText: '后一页',
14    lastText: '最后一页',
15    refreshText: '刷新',
16    updateInfo: function(){
17        if(this.displayEl){
18            var count = this.store.getCount();
19
20            var msg = count == 0 ? this.emptyMsg : String.format(this.displayMsg, this.cursor, this.cursor + count - 1, this.store.getTotalCount());
21
22            this.displayEl.update(msg);
23        }
24    },
25
26    onLoad: function(store, r, o){
27        if(!this.rendered){
28            this.dsLoaded = [store, r, o];
29
30            return;
31        }
32
33        if(!o.params || this.store.getTotalCount() == 0){
34            this.cursor = 0;
35        }
36        else{
37            this.cursor = (o.params[this.paramNames.start] - 1) * this.pageSize + 1;
38        }
39
40        var d =this.getPageData(), ap = d.activePage, ps = d.pages;
41
42        this.afterTextEl.el.innerHTML = String.format(this.afterPageText, d.pages);
43        this.field.dom.value = ap;
44
45        this.first.setDisabled(ap == 1 || ps == 0);
46        this.prev.setDisabled( ap == 1 || ps == 0);
47        this.next.setDisabled(ap == ps || ps == 0);
48        this.last.setDisabled(ap == ps || ps == 0);
49        this.loading.enable();
50        this.loading.setDisabled(ps == 0);
51        this.updateInfo();
52    },
53
54    getPageData: function(){
55        var total = this.store.getTotalCount();
56
57        return {
58            total: total,
59            activePage: total != 0 && this.cursor == 0 ? 1 : Math.ceil(this.cursor / this.pageSize),
60            pages: total !=0 && total < this.pageSize ? 1 : Math.ceil(total / this.pageSize)
61        }
62    },
63
64    onClick: function(which){
65        var store = this.store;
66        var d = this.getPageData();
67
68        switch(which){
69            case 'first':
70                this.doLoad(1);
71                break;
72            case 'prev':
73                this.doLoad(Math.max(1, d.activePage - 1));
74                break;
75            case 'next':
76                this.doLoad(Math.min(d.pages, d.activePage + 1));
77                break;
78            case 'last':
79                this.doLoad(d.pages);
80                break;
81            case 'refresh':
82                this.doLoad(d.activePage);
83                break;
84        }
85    }
86});
87
88Ext.reg('pagingtoolbarex', Ext.PagingToolbarEx);

原文地址