laypage

<%@ 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")

@ResponseBody

public 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);

    

}

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

时间： 2024-10-26 07:21:20

laypage的相关文章

Laravel5.1 与 Laypage 结合进行分页

路由 Route::match(array('get','post'),'/orm','[email protected]'); 控制器 <?php namespace App\Http\Controllers; use Illuminate\Http\Request; use App\Http\Requests; use App\User; //user表的模型 use App\Phone; //phone表的模型 class StuController extends Controller

TP3.23 与Laypage 结合进行分页 增删改查

控制器 <?php namespace Home\Controller; use Think\Controller; class IndexController extends Controller { /** *@brief 查询 ****/ public function index(){ $choose = I('choose','-6'); $c['easy_hard'] = $choose; $type=I('typeid',''); $nowpage=I('page',1); if(

Laypage 使用

前台和后台代码呈现: 1.HTML 页面: 1 <style> 2 table tr th { 3 width: 100px; 4 } 5 6 table tr td { 7 width: 100px; 8 } 9 </style> 10 <script src="~/Scripts/jquery-1.8.2.js"></script> 11 <script src="~/Scripts/js/laypage-v1.3/l

laypage分页源码

layui.use(['laypage', 'layer'], function(){     var laypage = layui.laypage         ,layer = layui.layer;     var $ = layui.$;         var total_page = $("#total_page").val();         laypage.render({             elem: 'demo1'             ,limit

LayUI分页，LayUI动态分页，LayUI laypage分页，LayUI laypage刷新当前页

LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> ?Copyright 蕃薯耀 2017年8月1日 http://www.cnblogs.com/fanshuyao/ 效果图: 一.引用js依赖

laypage分页

1.分页 laypage({ cont:$("#page"), //容器,仅支持id名\原生DOM对象,jquery对象 pages:10, //总页数 skip:true, //是否开启跳页 groups:5, //连续显示分页数 first:1, //首页 last:10, //尾页 skin:'#fff', //皮肤 curr:2, //当前页 jump:function(obj,first){ //触发分页后的回调 //触发分页后的回调,并传递当前页obj.cuur if(!f

使用laypage进行分页

laypage是一款开源的js分页组件,用起来十分方便,官网:http://sentsin.com/layui/laypage/ 前台代码: <head> <title>用户列表</title> <script src="~/Scripts/jquery-1.11.1.min.js"></script> <script src="~/Scripts/laypage.js"></script

php 经典分页（推荐和laypage配合）

学习地址:http://www.imooc.com/video/2463 <?php //(ps:推荐使用laypage整站式跳转来渲染分页按钮样式比较舒服http://laypage.layui.com/,还可以开启内置样式和跳页等功能很不错哦~) //require_once '../include.php'; //$sql="select * from imooc_admin"; //$totalRows=getResultNum($sql); ////echo $tota

记录项目中用的laypage分页代码

最终才觉得,好记性不如烂笔头,毕竟已经不是刚毕业时候的巅峰了,精力有所下降,很多时候记不住东西. 参考url:http://www.layui.com/laypage/ 直接上代码了 <script src="/assets/js/laypage/laypage.js"></script> 进入页面时,默认加载第一页:定时器每隔60秒取新数据: $(document).ready(function () { initPaganation(); setInterv