Ext.grid.GridPanel+WEB SERVICE分页-新手

Ext.grid.GridPanel+WEB SERVICE分页---新手求助
最近公司做一个项目是把以前的WIN32程序WEB化，我用EXTJS3.0+.NET做，做表数据显示时分页功能始终不能实现，数据始终在一页上面，由于接触EXTJS不久，所以请高手些帮忙看一下，下面是源代码：

JScript code

var cm = new Ext.grid.ColumnModel([            {header:'ROLEID', dataIndex:'ROLEID',width:0,hidden:true},            {header:'角色名', dataIndex:'ROLENAME', sortable:true,width:480}                ]);    // 数据源    store = new Ext.data.Store({        url: '../EgsmWebService.asmx/getRoles',          reader: new Ext.data.XmlReader(            {                totalRecords: 'rolecount',                    record: 'roleinfo'                  },            [                {name:'ROLEID'},                {name: 'ROLENAME'}            ]        )    });        store.setDefaultSort('ROLEID', 'asc');        var bbar = new Ext.PagingToolbar(        {            pageSize: 12,            store: store,            displayInfo: true,            displayMsg: '当前显示 {0} - {1} 条，共 {2} 条',            emptyMsg: "无数据"        }    );         // GridPanel 组件    grid = new Ext.grid.GridPanel({        frame: true,        sortable:true,        enableHdMenu: false,        width :480,        height:300,        loadMask: {msg:'正在加载数据，请稍侯……'},        store: store,        cm: cm,        el:'rolegrid',        bbar: bbar,        viewConfig: {            forceFit:true        }    });     grid.on("cellclick",function (g,r,c,e){        ds = grid.getStore();        record=grid.getSelectionModel().getSelected();    });    grid.addListener('rowdblclick',function(t,r,e){});    grid.render();        store.load({params:{start:0,limit:12}}); 

网上找了很多例子，都这么写的，但是我这么写就不行，我的数据也不只12行，它把所有数据都显示在一页上面，多了的就加了滚动条，请高手门帮忙解决一下。小弟先谢过了```

[解决办法]
刚刚下去做了个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();%> 

 

查看更多 下一篇