本文主要是介绍实现分页查询的思路与代码,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
- 思维图
- handler层(也就是control层)
/*** 分页查询* @param keyword* @param pageNum* @param pageSize* @param modelMap* @return*/@RequestMapping("/admin/get/page.html")public String getPageInfo(// 在请求中没有携带对应参数时,使用defaultValue提供默认值// keyword默认使用空字符串,和sql语句配合实现两种情况的适配@RequestParam(value = "keyword",defaultValue = "") String keyword,// PageNum默认值使用1,页面默认显示第一页@RequestParam(value = "pageNum",defaultValue = "1") Integer pageNum,// PageSize默认值使用5@RequestParam(value = "pageSize",defaultValue = "5") Integer pageSize,ModelMap modelMap) {// 调用Service方法获取PageInfo对象PageInfo<Admin> pageInfo = adminService.getPageInfo(keyword, pageNum, pageSize);// 将PageInfo对象存入模型modelMap.addAttribute(CrowdConstant.ATTR_NAME_PAGE_INFO,pageInfo);return "admin-page";}
- service层
@Overridepublic PageInfo<Admin> getPageInfo(String keyword, Integer pageNum, Integer pageSize) {// 1.调用PageHelper的静态方法开启分页功能PageHelper.startPage(pageNum,pageSize);// 2.执行查询List<Admin> list = adminMapper.selectAdminBuKeyword(keyword);// 3.封装到PageInfo对象中,并返回return new PageInfo<>(list);}
- 分页插件的依赖
<!-- mybatis分页插件 --><dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper</artifactId><version>4.0.0</version></dependency>
- mapper层
<select id="selectAdminBuKeyword" resultMap="BaseResultMap">select id, login_acct, user_pswd, user_name, email, create_timefrom tb_adminwherelogin_acct like concat("%",#{keyword},"%") oruser_name like concat("%",#{keyword},"%") oremail like concat("%",#{keyword},"%")</select>
- 前端JS
<!-- 分页插件要在jQuery的后面 -->
<link rel="stylesheet" href="css/pagination.css">
<script type="text/javascript" src="jquery/jquery.pagination.js"></script><script type="text/javascript">$(function () {// 调用后面声明的函数对页面导航条进行初始化操作initPagination();});// 生成页码导航条函数function initPagination() {// 获取总记录数var totalRecord = ${requestScope.pageInfo.total};// 声明一个JSON对象存储Pagination要设置的属性var properties = {num_edge_entries: 3, // 边缘页num_display_entries: 5, // 主体页数callback: pageSelectCallback, // 指定用户点击翻页时跳转页码的回调函数items_per_page: ${requestScope.pageInfo.pageSize}, // 每页显示多少条数据current_page: ${requestScope.pageInfo.pageNum - 1}, // 两者开始的下标不一致prev_text: "上一页", // 上一页按钮上显示的文本next_text: "下一页" // 下一页按钮上显示的文本};// 生成页码导航条$("#Pagination").pagination(totalRecord,properties);}// 回调函数的含义:声明出来之后不是自己调用,而是交给系统或框架调用// 用户点击页码调用这个函数进行页码跳转// pageIndex是Pagination传给我们那个从0开始的页码,使用的时候要+1function pageSelectCallback(pageIndex,jQuery) {// 根据pageIndex计算得到pageNumvar pageNum = pageIndex + 1;// 跳转页面window.location.href = "admin/get/page.html?pageNum="+pageNum+"&keyword=${param.keyword}";// 由于每一个页码按钮都是超链接,所以在这个函数最后取消超链接的默认行为return false;}</script><tfoot><tr><td colspan="6" align="center"><div id="Pagination" class="pagination"><!-- 此处显示分页 --></div></td></tr>
</tfoot>
- 需要导入分页相关的css代码
@charset "utf-8";
.pagination a {text-decoration: none;border: 1px solid #AAE;color: #15B;
}.pagination a, .pagination span {display: inline-block;padding: 0.1em 0.4em;margin-right: 5px;margin-bottom: 5px;
}.pagination .current {background: #26B;color: #fff;border: 1px solid #AAE;
}.pagination .current.prev, .pagination .current.next{color:#999;border-color:#999;background:#fff;
}
- 导入jquery.pagination.js包网上下载即可
感谢封捷老师,目标思路代码
这篇关于实现分页查询的思路与代码的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!