EUI分页显示的设置
JSP页面
<script type="text/javascript"src="lib/jquery-1.8.0.min.js"></script>
<script type="text/javascript"src="lib/jquery.easyui.min.js"></script>
<script type="text/javascript"src="lib/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet"href="lib/themes/icon.css" type="text/css"></link>
<link rel="stylesheet" href="lib/themes/gray/easyui.css"type="text/css"></link>
<body>
<table id="testGrid"></table>
<div id="tool">
<a id="btn" href="javascript:add()" class="easyui-linkbutton"data-options="iconCls:'icon-add'">增加</a>
<a id="btn"href="javascript:del()" class="easyui-linkbutton"data-options="iconCls:'icon-remove'">删除</a>
<a id="btn"href="javascript:update()" class="easyui-linkbutton"data-options="iconCls:'icon-edit'">修改</a>
<a id="btn"href="javascript:search()" class="easyui-linkbutton"data-options="iconCls:'icon-search'">查找</a>
</div>
</body>
<script type="text/javascript">
//初始函数,用来显示所有的列表
$(function(){
$("#testGrid").datagrid({
url:'fenye1.action?time'+new Date().getTime(),
fitColumns:true,
toolbar:'#tool',
sortName:'id',
sortOrder:'desc',
pagination:true,//显示分页栏
rownumbers:true,//显示行号
columns:[[
{checkbox:true},
{field:'id',title:'id',width:100,sortable:true},
{field:'username',title:'username',width:100},
{field:'pwd',title:'pwd',width:100},
{field:'sex',title:'sex',width:100,
formatter:function(value,rowdata,index){
if(value=='f')
return"<font color='green'>女</font>";
else
return"<font color='red'>男</font>";
}
},
{field:'strbirthday',title:'birthday',width:100}
]]
});
//设置分页控件
varp = $('#testGrid').datagrid('getPager');
$(p).pagination({
pageSize: 5,//每页显示的记录条数,默认为5
pageList: [5,10,15],//可以设置每页记录条数的列表
beforePageText: '第',//页数文本框前显示的汉字
afterPageText: '页 共 {pages} 页',
displayMsg: '当前显示 {from} - {to} 条记录 共 {total} 条记录'})
})
</script>
思路数量
1. 首先,sql语句:
在TestDao接口中,定义分页查询方法:
public List<Test>findByNameAndPass(Test t);
在TestMapper.xml中定义该方法使用的三千里语句
<select id="findByPageApp" parameterType="com.test.action.Page" resultType="com.test.action.Test">
select * from (select rownum r,id,username,pwd,sex,birthdaystrbirthday from test) where r between #{start} and #{end}
</select>
由于在sql语句中用到了两个值start和end,将这两个值封装到一个类Page中:
Page类的位置:
Page类的内容:
2.使用EUI分页时,点击换页时,会自动上传两个值:
rows;//每页显示的记录数,默认值为1
page;//当前第几页,默认值为10
因此在action中需要设置属性名字一样的变量,接收这2个值
Action的编写
public class Fenye extends ActionSupport {
private Test t;
private String rows;//每页显示的记录数
private String page;//当前第几页
TestImpl buss =new TestImpl();
public Test getT() {
return t;
}
public void setT(Test t) {
this.t = t;
}
public String getRows() {
return rows;
}
public void setRows(String rows) {
this.rows = rows;
}
public String getPage() {
return page;
}
public void setPage(String page) {
this.page = page;
}
public String fenye(){
HttpServletResponse response = ServletActionContext.getResponse();
response.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
//当前页
int intPage = Integer.parseInt(page);
//每页显示条数
int introws = Integer.parseInt(rows);
//每页的开始记录 第一页为1 第二页为number +1
int start =(intPage-1)*introws+1;
int end=intPage*introws;
Page p=new Page();
p.setStart(start);
p.setEnd(end);
int total=100;//记录总记录数,默认设置为100
total=buss.calCount();//计算出总记录数,并赋值给total
List<Test>list = buss. findByPageApp(p);//每页的数据,放入list
Map<String,Object> jsonMap = new HashMap<String, Object>();//定义map
jsonMap.put("total", total);//total键存放总记录数,必须的EUI会自动读取
jsonMap.put("rows", list);//rows键存放每页记录 list
String s=JSON.toJSONString(jsonMap);
try {
response.getWriter().print(s);
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
}
EUI分页显示的设置相关推荐
- cisco 和 华为的设备如何设置命令不分页显示
思科: > terminal length 0 华为: >user-interface vty 0 4 >screen-length 0 华为交换机不分页显示 user-interf ...
- android listview分页显示,Android应用中使用ListView来分页显示刷新的内容
点击按钮刷新1.效果如下: 实例如下: 上图的添加数据按钮可以换成一个进度条 因为没有数据所以我加了一个按钮添加到数据库用于测试:一般在服务器拉去数据需要一定的时间,所以可以弄个进度条来提示用户: ...
- asp oracle 分页显示,利用ASP实现Oracle数据记录的分页显示
[IT168 服务器学院]一.引言 通过浏览器访问数据量大的表时需要进行分页.ASP对数据库记录分页显示可以通过ADO对象集Recordset对象来实现.Recordset具有以下几个用于分页显示的属 ...
- JSP连接SQL数据库实现数据分页显示
<%@ page contentType="text/html; charset=gb2312" %> <%@ page language="java& ...
- Criteria查询之分页显示数据
Criteria对象的setMaxResults()方法可以限定查询返回的记录总数,其setFirstResult()方法可以设置满足条件的第1条记录的位置.二者配合时可以分页显示返回的数据 示例如下 ...
- Bootstrap4+MySQL前后端综合实训-Day07-PM【用户信息管理页面——功能展示(分页显示数据、添加用户、批量删除用户、编辑用户信息)、servlet项目代码整理汇总】
[Bootstrap4前端框架+MySQL数据库]前后端综合实训[10天课程 博客汇总表 详细笔记][附:实训所有代码] 目 录 页面展示 分页显示数据 添加用户信息 (单个/批量)删除用户 编辑 ...
- SSh结合Easyui实现Datagrid的分页显示
近日学习Easyui,发现非常好用,界面很美观.将学习的心得在此写下,这篇博客写SSh结合Easyui实现Datagrid的分页显示,其他的例如添加.修改.删除.批量删除等功能将在后面的博客一一写来. ...
- 浅谈AJAX并实现使用pagehelper-5.1.10.jar分页插件实现异步从数据库中获取数据分页显示
AJAX异步请求 什么是ajax 异步 JavaScript 同步和异步的区别 同步方式:正常情况下,浏览器与服务器之间是串行操作,类似于一个Java线程的操作. 异步方式:浏览器与服务器是并行操作, ...
- 使用PagedDataSource类实现DataList和Repeater控件的分页显示
Asp.net提供了三个功能强大的列表控件:DataGrid.DataList和Repeater控件,但其中只有DataGrid控件提供分页功能.相对DataGrid,DataList和Repeate ...
- 用php做一个分页显示的,php一个分页显示类
php一个分页显示类推荐查看本文HTML版本 <?php * 说明: * 1. 配合MYSQL数据库使用 * 2. 类没有提供连接数据库的功能,需在外部建立数据库连接. * */ /* ...
最新文章
- ESXI设备开机自启动虚拟机
- 【Groovy】Groovy 方法调用 ( 字符串切割 | 使用 Java 语法切割字符串 | 使用 Groovy 语法切割字符串直接为变量赋值 | 数组赋值给变量 变量个数小于等于数组长度 )
- USACO Training Section 1.3混合牛奶 Mixing Milk
- 一位软件工程师的7年总结(转)
- ue4 设置intellisence_UE4的配置界面写入
- TypeScript算法专题 - blog5 - 单链表节点的`任意k个分组反转`的实现
- 利用gganimate可视化R-Ladies发展情况
- 主成分分析(PCA)Principal Component Analysis
- [Jsoi2010]连通数
- 一体机or复合机?企业文印设备该怎么选
- java枚举详解_Java枚举的使用详解
- PSP播放AVI/PMP高清电影及视频转换指南
- 关于安卓打包脚本aab
- mysql引用表无效列_Mysql使用索引可能失效的场景
- 最简单DIY基于C#和51单片机上下位机一体化的PCA9685舵机控制程序
- 2020 CUMCM全国大学生数学建模竞赛 A题 Notes
- Nginx服务器启停命令
- SafeSignCertReg.exe导致系统工作异常
- GNVM版本下载太慢用淘宝镜像速度提百倍哈
- 分布式事务——两段式和三段式事务
热门文章
- 亚信安全:发挥MSS托管安全运营服务优势 让你真正“减负”
- sql_update
- 有位程序员写了部「修仙小说版」编程教程,网友:蚌埠住了 ....
- [每日100问][2011-10-06]iphone开发笔记,今天你肿了么
- Rhino 6 Essential Training Rhino6基本教程 Lynda课程中文字幕
- PTA习题【python】 6-8 jmu-python-发牌
- 洛谷 P3807 【模板】卢卡斯定理/Lucas 定理
- 【免费】多种方法手把手教你如何将自己做的网页做成网络链接(直接访问)
- SQL server 2008 全代码
- 芝麻信用分800+的技巧,get!