分页功能前后端代码实现
前端jsp代码:
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<html>
<head>
<meta name="decorator" content="default"/>
<script type="text/javascript"> //这里是pagination分页插件的jsp代码,传入要跳转的页码和页大小
function page(n, s) {
$("#pageNo").val(n);
$("#pageSize").val(s);
$("#searchForm").submit(); //提交searchForm表单,触发跳转
return false; //不接收返回值
}
</script>
</head>
<body>
<ul class="nav nav-tabs">
<li class="active"><a href="${ctx}/checkPic/list">图片审核</a></li>
</ul>
<form:form id="searchForm" modelAttribute="pictureDTO" action="${ctx}/checkPic/" method="post" class="breadcrumb form-search"> // searchForm表单,要设置modelAttribute,然后提交的url
<input id="pageNo" name="pageNo" type="hidden" value="${page.pageNo}"/> //提交跳转的页码
<input id="pageSize" name="pageSize" type="hidden" value="${page.pageSize}"/>
<sys:message content="${message}"/>
<table id="contentTable"
class="table table-striped table-bordered table-condensed">
<thead>
<tr>
<th>任务ID</th>
<th>图片</th>
<th>上传日期</th>
<th>操作</th>
</thead>
<tbody>
<c:forEach items="${page.list}" var="pic">
<tr>
<td>${pic.missionId}</td>
<td><img alt="加载失败" src="${pic.pic}" width="100px" height="100px"></td>
<td><fmt:formatDate value="${pic.createDate}" type="both"/></td>
<td>
<a href="${ctx}/checkPic/deletePictureByPicAddress?picAddress=${pic.pic}"
onclick="return confirmx('确认要删除吗？', this.href)">删除</a></td>
</tr>
</c:forEach>
</tbody>
</table>
<div class="pagination">${page}</div> //引入分页插件
</form:form>
</body>
</html>
后端代码:
package com.thinkgem.jeesite.modules.sys.web;
import com.thinkgem.jeesite.common.persistence.Page;
import com.thinkgem.jeesite.common.utils.StringUtils;
import com.thinkgem.jeesite.common.web.BaseController;
import com.thinkgem.jeesite.modules.api.service.MissionService;
import com.thinkgem.jeesite.modules.sys.entity.PictureDTO;
import com.thinkgem.jeesite.modules.sys.service.PictureDTOService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* Date:2020/6/4
* Author: RuanYongQi
*/
@Controller
@RequestMapping(value = "${adminPath}/checkPic")
public class PicController extends BaseController {
@Autowired
private PictureDTOService pictureDTOService;
@Autowired
private MissionService missionService;
@ModelAttribute //对应前端jsp中的modelAttribute属性
public PictureDTO get(@RequestParam(required=false) String id) {
if (StringUtils.isNotBlank(id)){
return pictureDTOService.get(id);
}else{
return new PictureDTO();
}
}
/**
* 图片审核接口
*/
@RequestMapping(value = {"/list", ""})
public String checkPicture(PictureDTO pictureDTO, HttpServletRequest request, HttpServletResponse response,Model model) {
Page<PictureDTO> page = pictureDTOService.findPicPage(new Page<PictureDTO>(request,response),pictureDTO);
model.addAttribute("page", page);
return "modules/sys/picList";
}
@RequestMapping(value = "/deletePictureByPicAddress")
public String deletePictureByPicAddress(@RequestParam String picAddress) {
missionService.deletePic(picAddress);
return "redirect:" + adminPath + "/checkPic/list?repage=" + Math.random(); //repage:用于记录当前的页码,删除后重定向到当前页码
}
}
这里没有放上page类,pictureDTO类等相关的类
如果没设置form表单里面的hidden pageNo属性,点击下一页只会一直刷出第一页
如果没设置form表单则分页插件会失效