实现分页查询
-
index.jsp页面请求EmployeeController**
<jsp:forward page="/emps"></jsp:forward>
-
编写EmployeeController
在org.westos.controller 包下编写EmployeeController @Controller public class EmployeeController { @RequestMapping(path = "/emps") public String getEmps(){ return "list"; } }
在 WEB-INF/views 下 建一个list.jsp
-
编写 EmployeeService
@Service //注解不要忘了 交个容器管理
public class EmployeeService {
//注入mapper
@Autowired
private EmployeeMapper employeeMapper;
public List<Employee> getAll(){
//因为查询所有,所以条件就传null
List<Employee> employees = employeeMapper.selectByExampleWithDept(null);
return employees;
}
}
-
在 EmployeeController 方法中调用业务层的查询所有,但是要进行分页查询
<dependency> <groupId>com.github.pagehelper</groupId> <artifactId>pagehelper</artifactId> <version>5.0.0</version> </dependency>
myBatis.xml中全局配置文件中配置
<!--注册分页插件--> <plugins> <plugin interceptor="com.github.pagehelper.PageInterceptor"></plugin> </plugins>
@RequestMapping(path = "/emps") //注意 index.jsp 发过来没有页码所以默认值是 defaultValue = "1" public String getEmps(@RequestParam(value = "pageNum", defaultValue = "1") Integer pageNum, Model model){ //使用pagehelper设置分页信息 //1.在查询所有之前使用PageHelper来设置页码和每页展示的条数 PageHelper.startPage(pageNum,5); //2.那么这个查询就是一个分页查询了 List<Employee> list = employeeService.getAll(); //3.把查询出的结果list包装到PageInfo里面,5是可选参数表示连续显示5页的页码 PageInfo pageInfo = new PageInfo(list,5); //4.把pageInfo放到域中转发到页面,就可以从pageInfo中取出分页的信息 model.addAttribute("pageInfo", pageInfo); return "list"; } }
-
测试分页查询
@RunWith(SpringJUnit4ClassRunner.class) /*注意这里要加载spring和springmvc的两个配置文件*/ @ContextConfiguration(value = {"classpath:applicationContext.xml", "classpath:springmvc.xml"}) @WebAppConfiguration //这个注解是为了把WebApplicationContext这个容器的对象放到容器中 public class MVCTest { @Autowired WebApplicationContext context; private MockMvc mockMvc; @Before public void init() { //构建MockMvc // 把 WebApplicationContext 对象传入 mockMvc = MockMvcBuilders.webAppContextSetup(context).build(); } @Test public void testRequest() throws Exception { //构建get请求 MockHttpServletRequestBuilder mb = MockMvcRequestBuilders.get("/emps").param("pageNum", "1"); //执行get请求,并获取返回的结果 MvcResult mvcResult = mockMvc.perform(mb).andReturn(); //那么返回的结果在request请求域中存着呢,我们把请求对象获取到,再从请求对象中取出数据展示 MockHttpServletRequest request = mvcResult.getRequest();//获取请求对象 PageInfo pageInfo = (PageInfo) request.getAttribute("pageInfo");//获取请求域中的数据 //获取当前页码 int pageNum = pageInfo.getPageNum(); //获取总页码 int pages = pageInfo.getPages(); //获取总条数 long total = pageInfo.getTotal(); //获取连续显示的页页码 int[] navigatepageNums = pageInfo.getNavigatepageNums(); //获取员工数据 List<Employee> list = pageInfo.getList(); System.out.println(pageNum); System.out.println(pages); System.out.println(total); System.out.println(Arrays.toString(navigatepageNums)); System.out.println(list); for (Employee employee : list) { System.out.println(employee); } } } 在pom.xml中把servlet的api换一个高点的版本 <dependency> <groupId>javax.servlet</groupId> <artifactId>javax.servlet-api</artifactId> <version>3.1.0</version> <scope>provided</scope> </dependency>
-
完成 list.jsp页面的布局
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>SSM_CRUD</title> <%--引入Jquery--%> <script src="${pageContext.request.contextPath}/static/js/jquery-1.12.4.min.js"></script> <%--引入bootstrap的样式--%> <link href="${pageContext.request.contextPath}/static/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"> <%--引入bootstrap的js样式--%> <script src="${pageContext.request.contextPath}/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <%--标题行--%> <div class="row"> <%-- col-md-12 的意思是让他把12列占完--%> <div class="col-md-12"> <h1>SSM_CRUD</h1> </div> </div> <%--按钮行--%> <div class="row"> <%--按钮列占4列,偏移8列,那就位于最右边了--%> <div class="col-md-4 col-md-offset-8"> <button class="btn btn-primary">添加</button> <button class="btn bg-danger">删除</button> </div> </div> <%--显示表格数据的行--%> <div class="row"> <%--表格数据就占12列把一整行占完--%> <div class="col-md-12"> <table class="table table-hover table-bordered"> <tr> <th>编号</th> <th>姓名</th> <th>性别</th> <th>邮箱</th> <th>部门</th> <th>操作</th> </tr> <%--取出员工信息--%> <c:forEach items="${pageInfo.list}" var="emp"> <tr> <td>${emp.empId}</td> <td>${emp.empName}</td> <td>${emp.gender=="M"?"男":"女"}</td> <td>${emp.email}</td> <td>${emp.department.deptName}</td> <td> <%-- btn-sm 表示按钮的尺寸是小一点的按钮--%> <button class="btn btn-primary btn-sm"> <span class="glyphicon glyphicon-pencil"></span> 编辑 </button> <button class="btn btn-danger btn-sm"> <span class="glyphicon glyphicon-trash"></span> 删除 </button> </td> </tr> </c:forEach> </table> </div> </div> <%--显示分页按钮--%> <div class="row"> <%--分页文字信息占6列--%> <div class="col-md-6"> 当前第 ${pageInfo.pageNum} 页/总页数 ${pageInfo.pages} 页 总记录数 ${pageInfo.total} 条 </div> <%--分页按钮占6列--%> <div class="col-md-6"> <nav aria-label="Page navigation"> <ul class="pagination"> <li><a href="${pageContext.request.contextPath}/emp?pageNum=1">首页</a></li> <%--判断如果还有上一页按钮,再显示上一页的按钮--%> <c:if test="${pageInfo.hasPreviousPage}"> <li> <a href="${pageContext.request.contextPath}/emps?pageNum=${pageInfo.pageNum-1}" aria-label="Previous"> <span aria-hidden="true">上一页</span> </a> </li> </c:if> <%--取连续的页码--%> <c:forEach items="${pageInfo.navigatepageNums}" var="page"> <%--判断如果页码是当前页就高亮显示 class="active" 这个样式 bootstrap 可以高亮显示--%> <c:if test="${pageInfo.pageNum==page}"> <li class="active"> <a href="${pageContext.request.contextPath}/emps?pageNum=${page}">${page}</a> </li> </c:if> <c:if test="${pageInfo.pageNum!=page}"> <li> <a href="${pageContext.request.contextPath}/emps?pageNum=${page}">${page}</a> </li> </c:if> </c:forEach> <%--判断如果还有下一页,再显示下一页的按钮--%> <c:if test="${pageInfo.hasNextPage}"> <li> <a href="${pageContext.request.contextPath}/emps?pageNum=${pageInfo.pageNum+1}" aria-label="Next"> <span aria-hidden="true">下一页</span> </a> </li> </c:if> <li> <a href="${pageContext.request.contextPath}/emps?pageNum=${pageInfo.pages}">末页</a> </li> </ul> </nav> </div> </div> </div> </body> </html>