<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/views/common/taglibs.jsp"%>
<!DOCTYPE html><html><head><script src="${ctx}/static/jquery-1.9.0.min.js"></script>
<script src="${ctx}/static/laypage/laypage.js"></script>
<script type="text/javascript">
$(function (){
demo();
});
function demo(curr) {
var pageSize = 10;
//以下将以jquery.ajax为例，演示一个异步分页
$.getJSON('${ctx}/system/user/ajax_list.do', {
page: curr || 1,
pageSize: pageSize
},
function (res) { //从第1页开始请求。返回的json格式可以任意定义
laypage({
cont: 'page1', //容器。值支持id名、原生dom对象，jquery对象。【如该容器为】：<div id="page1"></div>
pages: Math.ceil(res.Total/pageSize), //通过后台拿到的总页数
curr: curr || 1,
//first: '首页', //若不显示，设置false即可
//last: '尾页', //若不显示，设置false即可
//prev: '<', //若不显示，设置false即可
//next: '>', //若不显示，设置false即可
jump: function (obj,first) { //触发分页后的回调
if(!first){ //点击跳页触发函数自身，并传递当前页：obj.curr
demo(obj.curr);
}
}
});
$('#tbody').html(PackagData(res));
});
}function PackagData(res){
var content="";
$.each(res.Rows,function(i,o){
content+="<tr><td>";
content+=o.id;
content+="</td><td>";
content+=o.realname;
content+="</td></tr>";
});
return content;
}</script></head><body><table id="Result" cellspacing="0" cellpadding="0" border="1">
<tr>
<th>id</th>
<th>名称</th>
</tr>
<tbody id="tbody">
</tbody>
</table>
<div id="page1"></div>
</body> </html> |
[2].[代码] 这是后台java代码，用的是springMVC 跳至 [1] [2]
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
/* * 用户列表
*/
@RequestMapping("/ajax_list")
@ResponseBodypublic Map list(HttpServletRequest request,
@RequestParam(value="page",defaultValue="1") int page ,
@RequestParam(value="pageSize",defaultValue="10") int pagesize){
Map<String, Object> searchParams = Servlets.getParametersStartingWith(request, "search_");
Map<String, SearchFilter> filters = SearchFilter.parse(searchParams);
//超级管理员查询所有
if (!UserUtils.isAdmin())
filters.put("areaid", new SearchFilter("areaid",Operator.GT,UserUtils.getCurrentUserAreaId()));
NewPager pager = new NewPager();
pager.setPageNumber(page);
pager.setPageSize(pagesize);
pager.setFilters(filters);
if(StringUtils.isNotBlank(request.getParameter("deptid")) && StringUtils.isNotBlank(request.getParameter("deptname"))){
return service.queryPage(pager,request.getParameter("deptid"));
}
return service.queryPage(pager);
} |
总之，查出的东西需要拼接后才可以使用。