EXtJS pagingtoolbar 范例代码

EXtJS pagingtoolbar 实例代码
刚刚下去做了个demo, 可以基本确定的是楼主没有理解ext分页的操作流程。
当GridPanel加上PagingToolbar之后, 每次请求数据或者点上一页或下一页的时候， ajax都会向后台发送至少两个参数：start, limit, 你debug以下后台就知道了。所以ext分页是靠后台利用这两个参数取合适的数据来做的。
因为我刚才测试的时候我PagingToolbar的pageSize限制为3， 但是我发送4条数据页面还是现实4条，所以我猜测你后台都是取出所有的数据。
如果你看得懂jsp, 我的测试代码给你看看：
1.jsp:后台取数据用。我没有真连数据库，只是模拟取数据
Java code

<%
        request.setCharacterEncoding("utf-8");
        String _start = request.getParameter("start");
        String _limit = request.getParameter("limit");
        int start = Integer.parseInt(_start);
        int limit = Integer.parseInt(_limit);
        //返回的json字符串
        String responseString = "{total:50,data:[";
        for(int i=0; i<limit; i++){
                responseString+= ("{id: 'id" + i+start + "',name:'name" + i+start + "',email:'email" + i+start + "'}");
                if(i!=limit-1){
                        responseString+= ",";
                }
        }
        responseString+="]}";
       
        System.out.println(responseString);
        response.setCharacterEncoding("utf-8");
        response.setContentType("text/json;charset=utf-8");
        response.getWriter().write(responseString);
        response.flushBuffer();
        response.getWriter().close();
%>



前台paging.js:
JScript code

Ext.onReady(function(){
    var store = new Ext.data.JsonStore({
        root: 'data',
        totalProperty: 'total',
        id: 'id',
        fields: [
            {name: 'id', type: 'string'},
            {name: 'name', type: 'string'},
            {name: 'email', type: 'string'}
        ],
        proxy: new Ext.data.HttpProxy({
            url: 'http://localhost:8080/1.jsp'
        })
    });

    var pagingBar = new Ext.PagingToolbar({
        pageSize: 3,
        store: store,
        displayInfo: true,
        displayMsg: 'Displaying topics {0} - {1} of {2}',
        emptyMsg: "No topics to display"
    });

    var grid = new Ext.grid.GridPanel({
        el:'topic-grid',
        width:500,
        height:300,
        title:'ExtJS Paging Test',
        store: store,
        columns:[
                {header:"ID",dataIndex:"id"},
                    {header:"Name",dataIndex:"name"},
                    {header:"EMail",dataIndex:"email"}
        ],
        bbar: pagingBar
    });
    grid.render();
    store.load({params:{start:0, limit:3}});
});