Ext 的分页（spring+hibernate+ext+dwr）
方式一，json传递的数据用jsp来传递（比较简单）
1，page_01.jsp
<%@ page language="java" contentType="text/html; charset=GBK"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Insert title here</title>
<link type="text/css" rel="stylesheet" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
</head>
<body>
<script type="text/javascript" src="page_01.js"></script>
<div id="grid3" style="width: 100%;height: 100%">
</body>
</html>
2，page_01.js
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL = 'ext/resources/images/default/s.gif';
Ext.QuickTips.init();
var sm = new Ext.grid.CheckboxSelectionModel();
var cm = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),
sm,
{header:'编号',dataIndex:'id',sortable:true},//设置编号排序
{header:'名称',dataIndex:'name'},
{header:'描述',dataIndex:'descn'},
{header:'其他',dataIndex:'other'}
]);
//proxy直接去读取josn数据
var ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'page_01_url.jsp'}),//提交的页面，刷新数据将会调用给页面
reader: new Ext.data.JsonReader({
totalProperty: 'totalProperty',
root: 'root',
successProperty :'success'
}, [
{name: 'id',type:'int'},
{name: 'name',type:'string'},
{name: 'descn',type:'string'},
{name: 'other',type:'string'}
])
});
// alert(ds.getCount()); //得到总共数据
//设置分页
var grid = new Ext.grid.GridPanel({
el: 'grid3', //页面对应的层ID
ds: ds,
sm: sm,
cm: cm,
width:700,
height:280,
bbar: new Ext.PagingToolbar({
pageSize: 10,
store: ds,
displayInfo: true,
displayMsg: '显示第 {0} 条到 {1} 条记录，一共 {2} 条',
emptyMsg: "没有记录"
})
});
//el:指定html元素用于显示grid
grid.render();//渲染表格
ds.load({params:{start:0, limit:10}});
});
3，page_01_url.jsp ,传递数据
<%@ page language="java" contentType="text/html; charset=GBK"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<body>
<%
String start = request.getParameter("start").toString();
String limit = request.getParameter("limit").toString();
try {
int index = Integer.parseInt(start);
int pageSize = Integer.parseInt(limit);
String json = "{totalProperty:100,root:[";
for (int i = index; i < pageSize + index; i++) {
json += "{id:" + i + ",name:'name" + i + "',descn:'descn" + i + "',other:'other"+i+"'}";
if (i != pageSize + index - 1) {
json += ",";
}
}
json += "]}";
response.getWriter().write(json);
//这句话就是把组织好的数据返回给Ext
response.getWriter().close();
//网上很多人，都没写这句话，这句话很重要，
//*****关闭页面输出流，否则数据将不会被显示*****
} catch(Exception ex) {
}
%>
</body>
</html>