Mybatis 带条件的前后端分页查询(pageHelper + pagination)
程序员文章站
2024-03-20 20:09:16
...
目标
以分页的形式把管理员信息显示到页面上 特殊需求:后端兼顾带关键词查询或者不带关键词查询,为了方便代码不冗余,写一个接口,后端采用PageHelper插件,前端采用Pagation分页插件
思想
这里以Admin为例, 梳理大致流程
1.编写AdminController.getPage(pageNum,pageSize,keyWord,modelMap);
这里注意,如何灵活的携带关键词或者不携带关键词进行分页查询 ,需要给keyWord设置一个默认值,默认为空
2. 在Controller中调用
PageInfo<Admin> pagInfo = AdminService.gePage(pageNum,pageSize,keyWord);
- 将pageInfo存入ModelMap 模型
- 重定向到页面中。
- 在Service层 通过PageHelper.startPage(pageNum,pageSize);进行分页
- 通过调用AdminMapper.selectAdminByKeyWord(keyWord);
- 编写Sql语句,通过like模糊查询 将keyword通过sql函数 concat连接字符串 w
select * from admin where name like concat("%",#{keyWord},"%")
8.返回pageInfo
代码实现
后端
AdminController
/**
* 带关键词或者不带关键词的分页查询
* @param pageNum
* @param pageSize
* @param keyWord
* @return 返回到admin-page页面
*/
@RequestMapping("/admin/page.html")
public String getAdminPage(@RequestParam(value = "pageNum",defaultValue = "1") Integer pageNum,
@RequestParam(value = "pageSize",defaultValue = "5") Integer pageSize,
//当keyWord为默认值空时,就代表不带条件的分页查询
@RequestParam(value = "keyWord",defaultValue = "") String keyWord,
ModelMap modelMap){
// 带关键词的查询
PageInfo<Admin> pageInfo = adminService.getAdminPage(pageNum,pageSize,keyWord);
// 将查询到的结果存入模型
modelMap.addAttribute(CrowdConstant.ATTR_NAME_PAGE_INFO,pageInfo);
return "admin-page";
}
AdminService
/**
* 带条件或者不带条件的分页查询
* @param pageNum
* @param pageSize
* @param keyWord
* @return
*/
@Override
public PageInfo<Admin> getAdminPage(Integer pageNum, Integer pageSize, String keyWord) {
// 分页,调用pageHelper插件的startPage()静态方法
PageHelper.startPage(pageNum,pageSize);
// 调用AdminMapper进行条件查询
List<Admin> adminList = adminMapper.selectAdminListByKeyword(keyWord);
// 返回pageInfo对象
return new PageInfo<>(adminList);
}
以上就是后端的代码
前端采用第三方插件 Pagination
首先 需要下载Pagination并且在项目中引入,该插件是依赖于jQuery的,所以需要先引入jQuery
- 在需要的页面引入相关css和jquery
2.编写Pagination js代码
<script>
$(function){
initPagation();
}
// 初始化分页
function initPagation(){
// 获取总页数
var totalRecord = ${requestScope.pageInfo.total};
// 调用分页导航条对应的jQuery对象的pagination()方法进行分页
// totalRecord 总页数 jsonObject json对象
$("#pagination").pagination(totalRecord,jsonObject)
}
// json对象
var jsonObject = {
items_per_page:${requestScope.pageinfo.pageSize}, //每页显示的记录数
//Pagation插件的当前页 是page_index, 是从0开始的, PageInfo对象的当前页是从1开始的,
current_page:${requestScope.pageinfo.pageNum-1}, // 当前页码, PageInfo对象是从1开始的,Pagation插件是从0开始的
num_edge_entries: 3, // 边缘页数 123 ... 455678... 91011
prev_text: "上一页", // 上一页按钮显示的文本
next_text: "下一页", // 下一页按钮显示的文本
callback: pageSelectCallback, // 回调函数,当用户进行"翻页",系统给出的响应
num_display_entries: 5 // 主体页数
}
/**
* 当用户点击"上一页、下一页、1、2、3"时的功能
* @param pageIndex
* @param jQuery
*/
function pageSelectCallback(pageIndex,jQuery){
// 定义pageNum PageInfo中的pageNum是从第一页开始的,Pagation的第一页是从0开始的,所以 pageNum = pageINdex + 1;
var pageNum = pageIndex + 1;
// 跳转页面
window.location.href = " 和后端接口对应?pageNum=“ + pageNum +"&keyWord=${param.keyWord}" ;
// 取消当前超链接的默认行为
return false;
}
</scipt>
至此,前后端的带条件的分页功能完成。 !
上一篇: Springboot+jwt+shiro
下一篇: 若依前后端分离版导入功能