Ext Grid分页

代码如下:
Ext.onReady(function() {
var ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'db.jsp'}),
reader: new Ext.data.JsonReader({
root: 'root1',
totalProperty: 'total'},
[ {name: 'id',type: 'int'},
{name: 'name'},
{name: 'descn'}])
});

var sm = new Ext.grid.CheckboxSelectionModel();


var cm = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),
sm,
{header:'编号',dataIndex:'id'},
{header:'名称',dataIndex:'name'},
{header:'描述',dataIndex:'descn'}
]);

var grid = new Ext.grid.GridPanel({
el: 'table',
ds: ds,
cm: cm,
viewConfig: {
forceFit: true
},
title: 'My First Grid',
sm:sm,
width: 600,
height:380,
loadMask: true,
frame: true,
bbar: new Ext.PagingToolbar({
pageSize: 10,
store: ds,
displayInfo: true,
displayMsg: '显示第 {0} 条到 {1} 条记录,一共 {2} 条',
emptyMsg: "没有记录"
})

})


ds.load({params:{start:0,limit:10}});
grid.render();
});


json传的数据如下:
{total:100,root1:[
{id:0,name:'name0',descn:'descn0'},
{id:1,name:'name1',descn:'descn1'},
{id:2,name:'name2',descn:'descn2'},
{id:3,name:'name3',descn:'descn3'},
{id:4,name:'name4',descn:'descn4'},
{id:5,name:'name5',descn:'descn5'},
{id:6,name:'name6',descn:'descn6'},
{id:7,name:'name7',descn:'descn7'},
{id:8,name:'name8',descn:'descn8'},
{id:9,name:'name9',descn:'descn9'}
]}

jsp代码如下:

<% @ page contentType = " text/html; charset=gbk " %>

<%
String start
= request.getParameter( " start " );
String limit
= request.getParameter( " limit " );
try {
   
int index = Integer.parseInt(start);
   
int pageSize = Integer.parseInt(limit);

    String json
= " {totalProperty:50,root1:[ " ;
   
for ( int i = index; i < pageSize + index; i ++ ) {
     
if (i % 2 == 0 ){
        json
+= " {id: " + i + " ,sex:'male " + " ',name:'name " + i + " ',descn:'descn " + i + " '} " ;
      }
else {
          json
+= " {id: " + i + " ,sex:'female " + " ',name:'name " + i + " ',descn:'descn " + i + " '} " ;
      }
       
if (i != pageSize + index - 1 ) {
            json
+= " , " ;
        }
    }
    json
+= " ]} " ;
    response.getWriter().write(json);
}
catch (Exception ex) {
}
%>

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值