JSP+SpringMVC实现分页

发表于 | 分类于 | | 阅读量 次

分页类别

分页又分为真分页(物理分页)和假分页(逻辑分页)

真分页

需要多少数据就查询多少数据

Mysql:limit

Oracle:rownum

缺点：不可移植

假分页

先将数据查询出来，通过list的截取获取到分页的数据

缺点：如果数据量太大，性能非常低

思路

这里我们做真分页，先从数据库中进行查询，拿到总记录数，设定每页显示的记录数量，从前端将当前页的下标传过来，然后通过当前页可以得出上一页下一页

1
2
3
4
5
6
7
8
9
10
11
12
13
总记录数：从数据库中查询得出

总页数：总记录数除以每页需要显示的记录数量

当前页：前端传过来，第一次进入默认第一页

首页：当前页为第一页

尾页：当前为总页数的那页

上一页：如果当前页不是第一页就当前页-1

下一页：如果当前页不是尾页就当前页+1

代码实现Demo

首先封装一个工具类，将首页尾页上一页下一页这些计算出来，方便后来使用

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
package com.ifueen.util;

import java.util.List;

/**
 * @author admin
 *	分页的工具类
 * @param <T>
 */
public class PageBeanUtil<T> {
		//当前页
		private Integer localPage;
		//总页数
		private Integer totalPage;
		//每页显示数量
		private Integer pageSize = 5;
		//总记录量
		private Integer totalNum;
		//首页
		private Integer firstPage = 1;
		//上一页
		private Integer prePage;
		//下一页
		private Integer nextPage;
		//尾页
		private Integer lastPage;
		//显示的数据
		private List<T> list;
		public PageBeanUtil() {
			// TODO Auto-generated constructor stub
		}
		public PageBeanUtil(Integer localPage, Integer totalNum) {
			super();
			this.localPage = localPage;	//当前页
			this.totalNum = totalNum;	//总记录数
			//总页数：如果总记录数对每页记录数能够整除，就取除数，如果不能整除，就取除数加1
			this.totalPage = this.totalNum % this.pageSize == 0 ? 
					this.totalNum / this.pageSize : this.totalNum / this.pageSize+1;
			//上一页：如果当前页为第一页，就返回当前页，否则就返回当前页-1
			this.prePage = this.localPage == 1 ? this.localPage : this.localPage - 1;
			//下一页：如果当前页为最后一页，就返回最后一页，否则就返回当前页+1
			this.nextPage = this.localPage == this.totalPage ? this.totalPage : this.localPage + 1;
			//最后一页：就等于总页数
			this.lastPage = this.totalPage;
		}
		public Integer getLocalPage() {
			return localPage;
		}
		public void setLocalPage(Integer localPage) {
			this.localPage = localPage;
		}
		public Integer getTotalPage() {
			return totalPage;
		}
		public void setTotalPage(Integer totalPage) {
			this.totalPage = totalPage;
		}
		public Integer getPageSize() {
			return pageSize;
		}
		public void setPageSize(Integer pageSize) {
			this.pageSize = pageSize;
		}
		public Integer getTotalNum() {
			return totalNum;
		}
		public void setTotalNum(Integer totalNum) {
			this.totalNum = totalNum;
		}
		public Integer getFirstPage() {
			return firstPage;
		}
		public void setFirstPage(Integer firstPage) {
			this.firstPage = firstPage;
		}
		public Integer getPrePage() {
			return prePage;
		}
		public void setPrePage(Integer prePage) {
			this.prePage = prePage;
		}
		public Integer getNextPage() {
			return nextPage;
		}
		public void setNextPage(Integer nextPage) {
			this.nextPage = nextPage;
		}
		public Integer getLastPage() {
			return lastPage;
		}
		public void setLastPage(Integer lastPage) {
			this.lastPage = lastPage;
		}
		public List<T> getList() {
			return list;
		}
		public void setList(List<T> list) {
			this.list = list;
		}
}

控制器里

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
package com.ifueen.controller.system;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;

import com.ifueen.domain.City;
import com.ifueen.domain.Jobs;
import com.ifueen.service.ICityService;
import com.ifueen.service.IJobsService;
import com.ifueen.util.PageBeanUtil;

@Controller
@RequestMapping("/system/jobs")
public class SystemJobsController {
	
	@Autowired
	private IJobsService js;
	
	/**
	 *分页
	 */
	@RequestMapping("/page")
	public String jobspage(Integer localPage,Model model) {
		PageBeanUtil<Jobs> pageBean = js.querypage(localPage);
		model.addAttribute("pageBean",pageBean);
		return "WEB-INF/system/jobs";
	}
}

service层接口

1
2
3
4
5
6
7
8
9
10
11
12
package com.ifueen.service;

import java.util.List;

import com.ifueen.domain.Jobs;
import com.ifueen.util.JobsConditionUtil;
import com.ifueen.util.PageBeanUtil;

public interface IJobsService {

	PageBeanUtil<Jobs> querypage(Integer localPage);
}

service接口的实现类

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
package com.ifueen.service.impl;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.ifueen.dao.IjobsDao;
import com.ifueen.domain.Jobs;
import com.ifueen.service.IJobsService;
import com.ifueen.util.JobsConditionUtil;
import com.ifueen.util.PageBeanUtil;

@Service
public class JobsServiceimpl implements IJobsService {

	@Autowired
	private IjobsDao jsd;
	/**
	 * 分页
	 */
	@Override
	public PageBeanUtil<Jobs> querypage(Integer localPage) {
		// TODO Auto-generated method stub
		if (localPage == null) { // 解决空指针异常问题
			localPage = 1;
		}
		Integer totalNum = jsd.queryNum();
		PageBeanUtil<Jobs> pageBeanUtil = new PageBeanUtil<>(localPage, totalNum);
		Integer one = (localPage - 1) * pageBeanUtil.getPageSize();// 分页两个参数中的第一个
		List<Jobs> list = jsd.Page(one, pageBeanUtil.getPageSize());
		pageBeanUtil.setList(list);
		return pageBeanUtil;
	}
}

dao层接口

1
2
3
4
5
6
7
8
9
10
11
12
package com.ifueen.dao;

import java.util.List;

import com.ifueen.domain.Jobs;

public interface IjobsDao {
	Integer queryNum();

	List<Jobs> Page(Integer one, Integer pageSize);

}

dao层接口的实现类，这里面进行对数据库的操作，这里引用了springJDBC来进行操作的，要先导入springJDBC包和去xml里面配置，不懂的话可以去搜一下怎么用springJDBC

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
package com.ifueen.dao.impl;

import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.jdbc.core.BeanPropertyRowMapper;
import org.springframework.jdbc.core.JdbcTemplate;
import org.springframework.stereotype.Repository;

import com.ifueen.dao.IjobsDao;
import com.ifueen.domain.Jobs;

/**
 * @author admin
 *
 */
/**
 * @author admin
 *
 */
@Repository
public class JobsDaoimpl implements IjobsDao{

	@Autowired
	private JdbcTemplate jdbc;
	
	/**
	 * 查询总记录数
	 */
	@Override
	public Integer queryNum() {
		// TODO Auto-generated method stub
		String sql = "select count(id) from jobs";
		Integer totalNum = jdbc.queryForObject(sql, Integer.class);
		return totalNum;
	}

	/**
	 * 查询分页中的数据
	 */
	@Override
	public List<Jobs> Page(Integer one, Integer pageSize) {
		// TODO Auto-generated method stub
		String sql = "select * from view_jobs_city limit ?,?";
		List<Jobs> page = jdbc.query(sql, new BeanPropertyRowMapper<Jobs>(Jobs.class), one,pageSize);
		return page;
	}	
}

后台就写完了，然后去前端jsp中引用

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
<!--职位列表-->
		<div class="container job-table">
			<table class="table table-hover">
				<tr>
					<th class="hidden-sm">编号</th>
					<th>工作职位</th>
					<th>地点</th>
					<th>人数</th>
					<th>薪资待遇</th>
					<th>岗位介绍</th>
					<th>岗位要求</th>
					<th>是否启用</th>
					<th>发布时间</th>
					<th>操作</th>
				</tr>
				<c:forEach items="${pageBean.list }" var="j">
				<tr>
					<th>#${j.id }</th>
					<th>${j.title }</th>
					<th>${j.cname }</th>
					<th>${j.jobnum }</th>
					<th>${j.treatment }</th>
					<th>${j.describes }</th>
					<th>${j.requires }</th>
					<c:if test="${j.isenabled }" var="i">
					<th><span class="glyphicon glyphicon-ok" aria-hidden="true"></span></th>
					</c:if>
					<c:if test="${!i}">
					<th><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></th>
					</c:if>
					<th>${j.inputdate }</th>
					<th>
						<a href="system/jobs/update?id=${j.id }" class="btn-default tableA"><span class="glyphicon glyphicon-pencil" aria-hidden="true">修改</span></a>
						<a href="system/jobs/del?id=${j.id }" class="btn-default tableA" onclick="return del()" id="del"><span class="glyphicon glyphicon-trash" aria-hidden="true">删除</span></a>
					</th>
				</tr>
				</c:forEach>
			</table>
			<!--分页-->
			<nav class="navbar-right">
				<ul class="pagination" id="paging">
					<li>
						<span>当前第${pageBean.localPage }页</span>
					</li>
					<li>
						<a href="system/jobs/page?localPage=1">
							<span aria-hidden="true">首页</span>
						</a>
					</li>
					<li>
						<a href="system/jobs/page?localPage=${pageBean.prePage }" aria-label="上一页">
							<span aria-hidden="true">上一页</span>
						</a>
					</li>
					<li>

					</li>
					<li>
						<a href="system/jobs/page?localPage=${pageBean.nextPage }" aria-label="下一页">
							<span aria-hidden="true">下一页</span>
						</a>
					</li>
					<li>
						<a href="system/jobs/page?localPage=${pageBean.lastPage }" aria-label="尾页">
							<span aria-hidden="true">尾页</span>
						</a>
					</li>
					<li>
						<span>总页数：共${pageBean.totalPage }页</span>
						<span>总记录数：共${pageBean.totalNum }条</span>
					</li>
				</ul>
			</nav>

实现效果如下：

❤赏点钱让我买杯快乐水8❤