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")@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); } |
总之,查出的东西需要拼接后才可以使用。
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& ...
随机推荐
- failed to open the runspace pool. the server manager winrm plug-in might be corrupted or missing
添加对127.0.0.1的监听 netsh http add iplisten 127.0.0.01 添加完后的效果
- NGUI屏幕自适应
NGUI确实是非常棒的一个做界面的插件,比起U3D自带的GUI要好很多,当然也有一些不好之处,毕竟什么都不可能那么完美. 最近在用Unity写游戏使用NGUI遇到了一个很多人都在遇到的问题,就是关于屏 ...
- VIM神器打造Javascript开发环境
http://xuyufish.com/vim%E7%A5%9E%E5%99%A8%E6%89%93%E9%80%A0javascript%E5%BC%80%E5%8F%91%E7%8E%AF%E5% ...
- Secondary NameNode:的作用?
前言 最近刚接触Hadoop, 一直没有弄明白NameNode和Secondary NameNode的区别和关系.很多人都认为,Secondary NameNode是NameNode的备份,是为了防止 ...
- aspx文件为什么会慢
你可以在 global.asax 的 Application_Start 方法中写一个日志,例如写 C# code ? 1 2 3 4 5 void Application_Start(objec ...
- linux命令每日一练习 创建新文件 列出文件的时候带着行号
touch ××× nl ****
- C语言学习1——结构体剖析
一、定义结构体变量的方法 1.1先声明结构体类型在定义变量名 例如: a.声明结构体类型 struct student { int num; char name[20]; char sex; int ...
- RHEL6 --部署phpMyAdmin与论坛系统
一.rpm安装LAMP平台部署phpMyAdmin 二.搭建wordpress个人博客系统 三.搭建论坛系统 一.rpm安装LAMP平台及部署phpMyAdmin 1.phpMyAdmin简介及获取方 ...
- local认证
文件路径 用途 示例 备注 #gedit /usr/local/etc/raddb/sites-available/default #gedit /usr/local/etc/raddb/sites- ...
- 在Eclipse for mac中配置tomcat,使web项目自动部署到tomcat
jdk.tomcat的配置就不多说了,网上一大堆. 一.发现问题 在eclipse中新建Dynamic Web Project,配置好本地的tomcat并写好代码后选择Run on Server,但运 ...