3.分页实现思路
*************************************************************
完成过程中重点注意事项
*************************************************************
1.前台页面字符串的拼接(最重要!!!!,刚开始接触特别容易出错,开发会天天写)
2.分页的逻辑(前台/后台)
前台要注意数据传递的参数和请求的方式(get/post) 开发几乎都用post
后台要注意数据的封装和json的返回格式(content-type)
3.pageBean的封装思想和数据来源以及数据的作用
4.必须要多练,这样方便分析框架对应源码实现思路
*************************************************************
分类分页显示必要条件
*************************************************************
1,要知道数据来源(cid从什么地方获取,为什么要用cid)
2,如何跨html进行数据传递
*************************************************************
前台页面业务逻辑
*************************************************************
1.ajax异步发起分页请求
2.发请求时需要提供 cid/currentPage/pageSize 3个参数 ,注意 cid是根据需求决定 currentPage/pageSize是必要条件
3.在ajax成功回调中对分页数据进行显示(重点在字符串拼接)
$.get("route/pageQuery",{cid:cid},function (pb) {
$("#totalPage").html(pb.totalPage); //显示总页数
$("#totalCount").html(pb.totalCount); //显示总数据量
//拼接页码字符串
var lis = "";
var fristPage = '<li><a href="javascript:void(0)">首页</a></li>';
var beforePage = '<li class="threeword"><a href="javascript:void(0)">上一页</a></li>';
lis += fristPage;
lis += beforePage;
for (var i = 0; i <= pb.totalPage ; i++) {
var li;
//创建页码的li
li = '<li><a href="javascript:void(0)">'+i+'</a></li>';
lis += li;
}
var lastPage = '<li class="threeword"><a href="javascript:;">末页</a></li>';
var nextPage = '<li class="threeword"><a href="javascript:;">下一页</a></li>';
lis += nextPage;
lis += lastPage;
$("#pageNum").html(lis);
});
}
*************************************************************
后台页面业务逻辑
*************************************************************
web层
1.接收cid/currentPage/pageSize参数
2.对参数进行处理 对数据做非空和默认值的处理
3.调用service的方法获取pageBean对象
4.把pageBean对象转成json返回浏览器
public void pageQuery(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1.接受参数
String currentPageStr = request.getParameter("currentPage");
String pageSizeStr = request.getParameter("pageSize");
String cidStr = request.getParameter("cid");
int cid = 0;//类别id
//2.处理参数
if(cidStr != null && cidStr.length() > 0){
cid = Integer.parseInt(cidStr);
}
int currentPage = 0;//当前页码,如果不传递,则默认为第一页
if(currentPageStr != null && currentPageStr.length() > 0){
currentPage = Integer.parseInt(currentPageStr);
}else{
currentPage = 1;
}
int pageSize = 0;//每页显示条数,如果不传递,默认每页显示5条记录
if(pageSizeStr != null && pageSizeStr.length() > 0){
pageSize = Integer.parseInt(pageSizeStr);
}else{
pageSize = 5;
}
//3. 调用service查询PageBean对象
PageBean<Route> pb = routeService.pageQuery(cid, currentPage, pageSize);
//4. 将pageBean对象序列化为json,返回
ObjectMapper mapper = new ObjectMapper();
response.setContentType("application/json;charset=utf-8");
mapper.writeValue(response.getOutputStream(),pb);
}
*************************************************************
service层
*************************************************************
封装PageBean对象
public PageBean<Route> pageQuery(int cid, int currentPage, int pageSize) {
//封装PageBean
PageBean<Route> pb = new PageBean<Route>();
//设置当前页码
pb.setCurrentPage(currentPage);
//设置每页显示条数
pb.setPageSize(pageSize);
//设置总记录数
int totalCount = routeDao.findTotalCount(cid);
pb.setTotalCount(totalCount);
//设置当前页显示的数据集合
int start = (currentPage - 1) * pageSize;//开始的记录数
List<Route> list = routeDao.findByPage(cid,start,pageSize);
pb.setList(list);
//设置总页数 = 总记录数/每页显示条数
int totalPage = totalCount % pageSize == 0 ? totalCount / pageSize :(totalCount / pageSize) + 1 ;
pb.setTotalPage(totalPage);
return pb;
}
*************************************************************
dao层
*************************************************************
查询具体分页对应数据
String sql = "select * from tab_route where cid = ? limit ? , ?";
template.query(sql,new BeanPropertyRowMapper<Route>(Route.class),cid,start,pageSize);
查询总数据个数
String sql = "select count(*) from tab_route where cid = ?";
template.queryForObject(sql,Integer.class,cid);
*************************************************************
|
|