我是阿福，公眾號「阿福聊編程」作者，一個在后端技術路上摸盤滾打的程序員，在進階的路上，共勉！文章已收錄在 JavaSharing 中，包含Java技術文章，面試指南，資源分享。

思路分析

MyBatis的PageHelper插件(后臺)

作用

以完全非侵入的方式在原有查詢基礎上附加分頁效果。從SQL層面來說，在SQL語句后面附加LIMIT子句。從Java代碼來說，把原來返回的List類型封裝為Page類型。

依賴信息

com.github.pagehelper

pagehelper

4.0.0

配置方式

那么如何讓插件起作用呢？就需要在SqlSessionFactoryBean中配置MyBatis插件

mysql

true

數據庫的Sql 腳本

SELECT

*

FROM

t_admin

WHERE

loginacct LIKE CONCAT('%','ad','%')

OR username LIKE CONCAT('%','ad','%')

OR email LIKE CONCAT('%','ad','%')

AdminMapper配置文件

id, loginacct, userpswd, username, email, createtime

SELECT

FROM

t_admin

WHERE

loginacct LIKE CONCAT('%',#{keyword},'%')

OR username LIKE CONCAT('%',#{keyword},'%')

OR email LIKE CONCAT('%',#{keyword},'%')

Mapper接口

List queryAdminByKeyWord(@Param("keyword") String keyword);

AdminServiceImpl

public PageInfo queryForKeywordSearch(int pageNum, int pageSize, String keyword) {

//調用PageHelper的工具方法，開啟分頁功能

PageHelper.startPage(pageNum, pageSize);

List adminBeans = adminMapper.queryAdminByKeyWord(keyword);

//執行分頁查詢

return new PageInfo(adminBeans);

}

AdminController

@RequestMapping("/queryAdmin")

public String queryAdminByKeyword(@RequestParam(value = "pageNum", defaultValue = "1") int pageNum,

@RequestParam(value = "pageSize", defaultValue = "5") int pageSize,

@RequestParam(value = "keyword", defaultValue = "") String keyword,

Model model) {

PageInfo adminBeanPageInfo = adminService.queryForKeywordSearch(pageNum, pageSize, keyword);

model.addAttribute(CrowdFundingConstant.ATTR_NAME_PAGE_INFO, adminBeanPageInfo);

return "admin/admin-page";

}

常量類

public class CrowdFundingConstant {

public static final String ATTR_NAME_PAGE_INFO="PAGEINFO-ADMIN";

}

到這里后臺的功能都實現完了，下面來實現前臺的功能。

頁面顯示 主體部分(前臺)

前臺頁面

#賬號名稱郵箱地址操作

抱歉，沒有用戶查詢的數據！！！！

varStatus="myStatus">

${myStatus.count}${item.loginAcct}${item.userName}${item.email}

class=" glyphicon glyphicon-check">

class=" glyphicon glyphicon-remove">

頁面導航條部分的實現

使用一個基于jQuery的分頁插件：Pagination

環境搭建

加入樣式文件，pagination.css引入工程，在需要的頁面引用pagination.css

加入Pagination的js文件，在需要的頁面引用jquery.pagination.js，這里要注意一下，需要把源碼文件中 這段代碼注釋掉：opts.callback(current_page, this); 因為在這個地方重新加載頁面，會造成死循環。

分頁導航條需要在HTML標簽中加入的部分

jQuery代

// 聲明函數封裝導航條初始化操作

function initPagination() {

// 聲明變量存儲總記錄數

var totalRecord = ${requestScope['PAGEINFO-ADMIN'].total};

// 聲明變量存儲分頁導航條顯示時的屬性設置

var paginationProperties = {

num_edge_entries: 3, //邊緣頁數

num_display_entries: 5, //主體頁數

callback: pageselectCallback, //回調函數

items_per_page: ${requestScope['PAGEINFO-ADMIN'].pageSize}, //每頁顯示數據數量，就是pageSize

current_page: ${requestScope['PAGEINFO-ADMIN'].pageNum - 1},//當前頁頁碼

prev_text: "上一頁", //上一頁文本

next_text: "下一頁" //下一頁文本

};

// 顯示分頁導航條

$("#Pagination").pagination(totalRecord, paginationProperties);

};

// 在每一次點擊“上一頁”、“下一頁”、“頁碼”時執行這個函數跳轉頁面

function pageselectCallback(pageIndex, jq) {

// pageIndex從0開始，pageNum從1開始

var pageNum = pageIndex + 1;

// 跳轉頁面

window.location.href = "admin/queryAdmin.action?pageNum=" + pageNum + "&keyword=${param.keyword}";

return false;

};

關鍵詞查詢

style="float:left;">

查詢

點擊查詢的按鈕就可以實現分頁查詢的功能了。