首页 > 代码库 > laypage

laypage

2024-08-27 23:55:07   220人阅读

<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/views/common/taglibs.jsp"%>
<!DOCTYPE html>
<html>
<head>
<script src=http://www.mamicode.com/"${ctx}/static/jquery-1.9.0.min.js"></script>
<script src=http://www.mamicode.com/"${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")
@ResponseBody
public Map list(HttpServletRequest request,
        @RequestParam(value=http://www.mamicode.com/"page",defaultValue=http://www.mamicode.com/"1") int page ,
        @RequestParam(value=http://www.mamicode.com/"pageSize",defaultValue=http://www.mamicode.com/"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);
     
}

 

 

总之，查出的东西需要拼接后才可以使用。

laypage


联系
我们