修改分页操作页面

Author: LinkinStars

src/main/java/com/linkinstars/springBootTemplate/controller/UserController.java

@@ -1,6 +1,7 @@
 package com.linkinstars.springBootTemplate.controller;
 
 import com.github.pagehelper.PageHelper;
+import com.github.pagehelper.PageInfo;
 import com.linkinstars.springBootTemplate.bean.UserEntity;
 import com.linkinstars.springBootTemplate.service.IUserService;
 import org.springframework.beans.factory.annotation.Autowired;
@@ -23,12 +24,15 @@ public class UserController {
     @RequestMapping("/test")
     public String test(HttpServletRequest request, @RequestParam(required = false) Integer pageNum){
         int pageSize = 3;
-        if (pageNum == null) {
+        if (pageNum == null || pageNum < 1) {
             pageNum = 1;
         }
         PageHelper.startPage(pageNum, pageSize);
         List<UserEntity> userList = userService.listUser();
+        PageInfo pageInfo = new PageInfo(userList);
         request.setAttribute("userList", userList);
+        request.setAttribute("pageNum", pageNum);
+        request.setAttribute("pageSum", pageInfo.getPages());
         return "index";
     }
 }

src/main/resources/static/js/public.js

@@ -0,0 +1,8 @@
+function jumpPage(pageNum, pageSum) {
+    pageNum = parseInt(pageNum);
+    pageSum = parseInt(pageSum);
+    if (pageNum < 1 || pageNum > pageSum) {
+        return "当前选择的页码没有数据";
+    }
+    return true;
+}

src/main/resources/templates/index.html

@@ -13,5 +13,26 @@
         <td th:text="${user.val}">2</td>
     </tr>
 </table>
+<input type="button" value="上一页" th:onclick="'gotoPage('+${pageNum-1}+', '+${pageSum}+')'" th:if="${pageNum ne 1}"/>
+<span th:text="${pageNum}"></span> / <span th:text="${pageSum}"></span>
+<input type="button" value="下一页" th:onclick="'gotoPage('+${pageNum+1}+', '+${pageSum}+')'" th:if="${pageNum ne pageSum}"/>
+<br/>
+
+<form th:action="@{/test}" method="post">
+    <input type="number" th:value="${pageNum}" name="pageNum"/>
+    <input type="submit" value="跳转"/>
+</form>
+
+<script type="application/javascript" src="../static/js/public.js" th:src="@{/js/public.js}"/>
+<script type="application/javascript" >
+    function gotoPage(pageNum, pageSum) {
+        var result = jumpPage(pageNum, pageSum);
+        if (result == true) {
+            window.location.href = "?pageNum=" + pageNum;
+        } else {
+            alert(result);
+        }
+    }
+</script>
 </body>
 </html>