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); } |
总之,查出的东西需要拼接后才可以使用。
laypage的更多相关文章
- laypage分页
1.分页 laypage({ cont:$("#page"), //容器,仅支持id名\原生DOM对象,jquery对象 pages:, //总页数 skip:true, //是否 ...
- 分页组件 - layui.laypage
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 非常好的分页组建layPage和 layer层特效
http://layer.layui.com/ http://sentsin.com/layui/laypage/
- Jquery+artTemplate+layPage 封装datagrid
导言 在日常开发中经常会用到列表,相信用过easyui,Ext等很多,的确很强大,但想修改确实也不容易,我也用了几年的easyui,有时间时会想一下,自已随然没有前端的精湛技术,但可以在有这些技术的开 ...
- php 经典分页(推荐和laypage配合)
学习地址:http://www.imooc.com/video/2463 <?php //(ps:推荐使用laypage整站式跳转来渲染分页按钮样式比较舒服http://laypage.layu ...
- laypage分页功能demo
demo代码如下: <div id="view1"></div> <div id="page1"></div> ...
- layPage异步分页
layPage分页,参照官网实例写了一份.如下: function InitDataByPage(curr) { ; $.getJSON("InitDataByPage", { & ...
- LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页
LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页 >>>>>>>>>>>> ...
- laypage 使用
最近发现一个特别好用的前端分页插件,分享一下 <!doctype html> <html> <head> <meta charset="utf-8& ...
随机推荐
- jquery选择相同ID
jQuery中$("#id")只能选择第一个对象,不能选择所有相同id的元素. 通过 $("input[id='xxxx']"); 可以选择多个相同id的元 ...
- regexxx
var test={ msg:{ "name":"name","value":"value" }}var str=JSO ...
- 白皮 Chapter 2
7.2 做题一遍就过的感觉简直太美好啦~然而我并没有测试数据QAQ //program name digit #include<cstdio> #include<iostream&g ...
- 分析自定义view的实现过程-实现雪花飞舞效果(转载有改动)
声明:本文源码出自实现雪花飞舞效果(有改动)主要通过这篇文来分析自定义view的实现过程. 没事时,比较喜欢上网看看一些新的东西,泡在网上的日子就是一个很不错的网站. 下面开始了,哈哈.^_^ 大家都 ...
- sqlmap的学习以及使用
PDF.NET(PWMIS数据开发框架)之SQL-MAP目标和规范 将复杂查询写到SQL配置文件--SOD框架的SQL-MAP技术简介 PDF.NET数据开发框架 之SQL-MAP使用存储过程 不懂还 ...
- Linux 文件的基本操作
1>.新建空白文件: touch命令-->$ touch test 2>.新建目录: mkdir命令-->$mkdir mydir 使用 -p参数:同时创建父目录-->$ ...
- 在sqlserver中做fibonacci(斐波那契)规律运算
--利用sqlserver来运算斐波那契规律 --利用事物与存储过程 declare @number intdeclare @A intdeclare @B intdeclare @C int set ...
- 再读C++线程池
最近仔细看了一下https://github.com/henkel/threadpool代码,总体感觉非常精巧,使用了 boost库的bind function完成了线程池与业务端的完全解耦:所有的任 ...
- HIS-DELPHI-读取数据库配置
产品思维: 1.做成可配置的 2.模块化 医生会有自己熟悉的药品,数据里面药品太多,让医生选择不放便 所以可以让医生自己维护自己的药品模板数据 比如医生开了处方后,可以保存当前的处方到某个模板中,那么 ...
- windows 下安装redis并且测试(php)
Window 下安装 下载地址:https://github.com/dmajkic/redis/downloads. 下载到的Redis支持32bit和64bit.根据自己实际情况选择,将64bit ...