最终效果如下


思路
前台需要展示的是一页一页的数据,每一页包含的信息有两个:当前页数(pageNow)、每一页有条数据(pageSize)。其他的事情前台不用关心,它的目的只是展示数据。而数据的来源在后台,前台告诉后台需要哪一页的数据以及这一页有多少条数据,pageSize是可以设定的,所以pageNow是前台和后台交互的核心。那么后台接收到前台的pageNow,要去识别它,根据这个参数到数据库取得数据返回给前台。
先说说pageNow,pageNow的值怎么设置?当然是后台告诉前台一共有多少页(totalPageCount),然后前台要展示的数据就在0~totalPageCount页之间,当前的处于哪一页就是pageNow的值;而pageSize,每一页记录数,这很好理解,每一页要展示多少数据。而pageSize(每一页记录数) * totalPageCount(页数) = 数据库中该表的记录总数(totalCount)。所以后台关心的有4个变量:pageNow、pageSize、totalPageCount、totalCount。这里的totalCount是已知的,数据库表的记录数,根据前台页面的展示效果如果pageSize确定,那么totalPageCount = totalCount / pageSize,而 pageNow 是前台数据的选择页。
例子
这里以mysql数据库,java ssm后台,前台bootstrap为例。
1).既然分页思路是通用的,把分页写成一个工具类,放在util包中,它与业务逻辑是没有关系的
package com.xforce.charles.util;
import java.io.Serializable;
public class Page implements Serializable {
private static final long serialVersionUID = -3198048449643774660L;
private int pageNow = 1;
private int pageSize = 10;
private int totalCount;
private int totalPageCount;
@SuppressWarnings("unused")
private int startPos;
@SuppressWarnings("unused")
private boolean hasFirst;
@SuppressWarnings("unused")
private boolean hasPre;
@SuppressWarnings("unused")
private boolean hasNext;
@SuppressWarnings("unused")
private boolean hasLast;
/**
* 通过构造函数 传入 总记录数 和 当前页
* @param totalCount
* @param pageNow
*/
public Page(int totalCount, int pageNow) {
this.totalCount = totalCount;
this.pageNow = pageNow;
}
/**
* 取得总页数,总页数=总记录数/总页数
* @return
*/
public int getTotalPageCount() {
totalPageCount = getTotalCount() / getPageSize();
return (totalCount % pageSize == 0) ? totalPageCount
: totalPageCount + 1;
}
public void setTotalPageCount(int totalPageCount) {
this.totalPageCount = totalPageCount;
}
public int getPageNow() {
return pageNow;
}
public void setPageNow(int pageNow) {
this.pageNow = pageNow;
}
public int getPageSize() {
return pageSize;
}
public void setPageSize(int pageSize) {
this.pageSize = pageSize;
}
public int getTotalCount() {
return totalCount;
}
public void setTotalCount(int totalCount) {
this.totalCount = totalCount;
}
/**
* 取得选择记录的初始位置
* @return
*/
public int getStartPos() {
return (pageNow - 1) * pageSize;
}
public void setStartPos(int startPos) {
this.startPos = startPos;
}
/**
* 是否是第一页
* @return
*/
public boolean isHasFirst() {
return (pageNow == 1) ? false : true;
}
public void setHasFirst(boolean hasFirst) {
this.hasFirst = hasFirst;
}
/**
* 是否有首页
* @return
*/
public boolean isHasPre() {
return isHasFirst() ? true : false;
}
public void setHasPre(boolean hasPre) {
this.hasPre = hasPre;
}
/**
* 是否有下一页
* @return
*/
public boolean isHasNext() {
return isHasLast() ? true : false;
}
public void setHasNext(boolean hasNext) {
this.hasNext = hasNext;
}
/**
* 是否有尾页
* @return
*/
public boolean isHasLast() {
return (pageNow == getTotalCount()) ? false : true;
}
public void setHasLast(boolean hasLast) {
this.hasLast = hasLast;
}
}
- 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
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
- 126
- 127
- 128
- 129
- 130
- 131
- 132
- 133
- 134
- 135
- 136
- 137
- 138
- 139
2).场景:前端向后台请求数据,传递pageNow参数
<a href="goindex?pageNow=2">Previous</a>
3).后台接收pageNow参数,向service层要数据
int pageNow = 1;
String s_pageNow = request.getParameter("pageNow");
if(null != s_pageNow) {
pageNow = Integer.parseInt(s_pageNow);
}
int tatolCount = statusService.getStatusCount();
Page page = new Page(tatolCount, pageNow);
List<StatusAndProductWrapper> statusAndProductWrapperList =
statusService.getStatusAndProductWrapper(page.getStartPos(), page.getPageSize());
model.addAttribute("statusAndProductWrapperList", statusAndProductWrapperList);
model.addAttribute("page", page);
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
4).service层调用dao层
interface
List<StatusAndProductWrapper> getStatusAndProductWrapper(int startPos, int pageSize);
int getStatusCount();
Impl
public List<StatusAndProductWrapper> getStatusAndProductWrapper(int startPos, int pageSize) {
return statusDao.selectStatusAndProductWrapperByPage(startPos, pageSize);
}
public int getStatusCount() {
return statusDao.selectStatusCount();
}
5).dao层
interface
List<StatusAndProductWrapper> selectStatusAndProductWrapperByPage(
@Param(value="startPos") Integer startPos, @Param(value="pageSize") Integer pageSize);
int selectStatusCount();
Mapping
<select id="selectStatusAndProductWrapperByPage" resultType="com.xforce.charles.model.StatusAndProductWrapper">
select ... from ... limit
</select>
<select id="selectStatusCount" resultType="java.lang.Integer">
select count(*) from status
</select>
如果是sql server
<select id="selectStatusAndProductWrapperByPage" resultType="com.xforce.charles.model.StatusAndProductWrapper">
select top #{pageSize} ... from ... where ... not in(select top #{startPos} id from ...)
</select>
如果是oracle
<select id="selectStatusAndProductWrapperByPage" resultType="com.xforce.charles.model.StatusAndProductWrapper">
select ... from (select ROWNUM rn, ... from (select ... from ... order by id asc) where ROWNUM <= (
</select>
6).前台展示,这里用bootstrap的样式
<ul class="pager">
<c:choose>
<c:when test="${page.pageNow - 1 > 0}">
<li><a href="goindex?pageNow=${page.pageNow - 1}">Previous</a></li>
</c:when>
<c:when test="${page.pageNow - 1 <= 0}">
<li><a href="goindex?pageNow=1">Previous</a></li>
</c:when>
</c:choose>
<li><a href="goindex?pageNow=${page.pageNow}">${page.pageNow}/${page.totalPageCount}</a></li>
<c:choose>
<c:when test="${page.totalPageCount==0}">
<li><a href="goindex?pageNow=${page.pageNow}">Next</a></li>
</c:when>
<c:when test="${page.pageNow + 1 < page.totalPageCount}">
<li><a href="goindex?pageNow=${page.pageNow + 1}">Next</a></li>
</c:when>
<c:when test="${page.pageNow + 1 >= page.totalPageCount}">
<li><a href="goindex?pageNow=${page.totalPageCount}">Next</a></li>
</c:when>
</c:choose>
</ul>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
7).总而言之,分页思路的逻辑是通用的。跟数据库、后台语言、前端框架无关