一、后端使用 PageHelper插件


【1】引入 PageHelper jar包(Maven项目)

1 <dependency>
2 <groupId>com.github.pagehelper</groupId>
3 <artifactId>pagehelper</artifactId>
4 </dependency>

【2】MyBatis 配置文件中配置插件(通过 Spring 配置中的 sqlsessionfactory 对此配置文件加载,将PageHelper加载到容器中)

1 <plugins>
2 <!-- com.github.pagehelper 为 PageHelper 类所在包名 -->
3 <plugin interceptor="com.github.pagehelper.PageHelper">
4 <!-- 设置数据库类型 Oracle,Mysql,MariaDB,SQLite,Hsqldb,PostgreSQL 六种数据库-->
5 <property name="dialect" value="mysql"/>
6 </plugin>
7 </plugins>

【3】Server 类中使用插件(重要)

 1 @Override
2 public PageResult findPage(int pageNum, int pageSize) {
3 /*@desc 使用插件进行分页处理 插件对分页的处理(重要)
4 *@parameter: pageNum:页码,pageSize:每页显示记录数
5 */
6 PageHelper.startPage(pageNum, pageSize);
7 //查询结果封装到Page类中,通过Total获取总记录数,Result获取查询的记录数(记录数=pageSize)
8 Page<TbBrand> page = (Page<TbBrand>) brandMapper.selectByExample(null);
9 return new PageResult(page.getTotal(),page.getResult());
10 }

二、前端使用分页插件(pagination.js),前端使用AngularJs框架


【1】引入 pagination.js 和 pagination.css

☞  pagination.js下载地址:https://download.csdn.net/download/lostchris/9425230
       ☞  pagination.css下载地址:https://download.csdn.net/download/zhengzhaoyang122/10641792

==== 具体注释说明====

 1 <script type="text/javascript" src="../plugins/angularjs/pagination.js"></script>
2 <link rel="stylesheet" href="../plugins/angularjs/pagination.css">
3 <script type="text/javascript">
4 //1、查询模块需要依赖pagination pagination模块在JS中有定义
5 var app = angular.module('pinyougou', ['pagination']);
6 app.controller('brandController', function($scope, $http) {
7 $scope.findAll = function() {
8 $http.get('../brand/findAll.do').success(function(response) {
9 $scope.brandList = response;
10 });
11 }
12 //2、需要在table结束后添加页数显示标签tm-pagination 并定义conf(位于博客最后)
13 /*3、将2中定义的conf变量,进行赋值
14 currentPage : 页码,
15 totalItems : 总记录数,
16 itemsPerPage : 每页显示记录数,
17 perPageOptions : 需要每页显示多少记录,用户可自定义,
18 onChange : 当页码发生变化时,出发事件。
19 */
20 //分页控件配置
21 $scope.paginationConf = {
22 currentPage : 1,
23 totalItems : 10,
24 itemsPerPage : 10,
25 perPageOptions : [ 10, 20, 30, 40, 50 ],
26 onChange : function() {
27 $scope.reloadList();//重新加载
28 }
29 };
30
31 //重新加载列表 数据
32 $scope.reloadList = function() {
33 //切换页码
34 $scope.findPage($scope.paginationConf.currentPage,
35 $scope.paginationConf.itemsPerPage);
36 }
37
38 //需要将查询结果 进行赋值,例如总记录数totalItems
39 $scope.findPage = function(page, rows) {
40 $http.get('../brand/findPage.do?pageNum=' + page + '&size=' + rows)
41 .success(function(response) {
42 $scope.brandList = response.rows;//需要遍历的对象
43 $scope.paginationConf.totalItems = response.total;//总记录数
44 });
45 }
46 });

【2】页面中 分页栏 显示标签代码如下:(位置是 table 结束后)

1     </table>
2 <!-- 分页显示栏 -->
3 <tm-pagination conf="paginationConf"></tm-pagination>

MyBatis 分页(前后端插件)实现的更多相关文章

  1. J2EE分布式微服务云开发架构 Spring Cloud+Mybatis+ElementUI 前后端分离J2EE分布式微服务云开发架构 Spring Cloud+Mybatis+ElementUI 前后端分离

    ​ 鸿鹄云架构[系统管理平台]是一个大型企业.分布式.微服务.云架构的JavaEE体系快速研发平台,基于模块化.微服务化.原子化.热部署的设计思想,使用成熟领先的无商业限制的主流开源技术(Spring ...

  2. Mybatis分页插件PageHelper的配置和使用方法

     Mybatis分页插件PageHelper的配置和使用方法 前言 在web开发过程中涉及到表格时,例如dataTable,就会产生分页的需求,通常我们将分页方式分为两种:前端分页和后端分页. 前端分 ...

  3. springboot + mybatis 前后端分离项目的搭建 适合在学习中的大学生

    人生如戏,戏子多半掉泪! 我是一名大四学生,刚进入一家软件件公司实习,虽说在大学中做过好多个实训项目,都是自己完成,没有组员的配合.但是在这一个月的实习中,我从以前别人教走到了现在的自学,成长很多. ...

  4. Thymeleaf前后端分页查询

    分页查询是一个很常见的功能,对于分页也有很多封装好的轮子供我们使用. 比如使用mybatis做后端分页可以用Pagehelper这个插件,如果使用SpringDataJPA更方便,直接就内置的分页查询 ...

  5. Mybatis分页插件PageHelper简单使用

    一个好的讲解mybatis的博客地址http://www.jianshu.com/nb/5226994 引言 对于使用Mybatis时,最头痛的就是写分页,需要先写一个查询count的select语句 ...

  6. SSM 使用 mybatis 分页插件 pagehepler 实现分页

    使用分页插件的原因,简化了sql代码的写法,实现较好的物理分页,比写一段完整的分页sql代码,也能减少了误差性. Mybatis分页插件 demo 项目地址:https://gitee.com/fre ...

  7. mybatis 分页插件

    博客地址http://www.jianshu.com/nb/5226994 引言 对于使用Mybatis时,最头痛的就是写分页,需要先写一个查询count的select语句,然后再写一个真正分页查询的 ...

  8. Spring Boot + Spring Cloud 实现权限管理系统 后端篇(八):MyBatis分页功能实现

    使用Mybatis时,最头痛的就是写分页,需要先写一个查询count的select语句,然后再写一个真正分页查询的语句,当查询条件多了之后,会发现真不想花双倍的时间写 count 和 select,幸 ...

  9. Mybatis学习---Mybatis分页插件 - PageHelper

    1. Mybatis分页插件 - PageHelper说明 如果你也在用Mybatis,建议尝试该分页插件,这个一定是最方便使用的分页插件. 该插件目前支持Oracle,Mysql,MariaDB,S ...

  10. 基于Mybatis分页插件PageHelper

    基于Mybatis分页插件PageHelper 1.分页插件使用 1.POM依赖 PageHelper的依赖如下.需要新的版本可以去maven上自行选择 <!-- PageHelper 插件分页 ...

随机推荐

  1. 等级保护2.0 三级-Linux 测评指导书

    等级保护2.0 三级-Linux 测评指导书 1.1安全计算环境 1.1.1身份鉴别        1.1.2访问控制        1.1.4入侵防范       1.1.5恶意代码防范      ...

  2. Windows下Redis安装及自启动

    Redis下载 Redis 官方网站没有提供 Windows 版的安装包,可以通过 GitHub 来下载 Windows 版 Redis 安装包,下载地址:点击前往. 打开上述的下载地址链接,Redi ...

  3. 狂神day3

    放个假,有几天没有学习了,也好久没有更新博客了 IDEA使用 在上一次的时候,我们直接建立一个工程写了一个"helloworld"的java文件,今天首先说的是先建立一个空的工程, ...

  4. grafana配置邮箱告警

    [root@localhost grafana]# cd /etc/grafana/ [root@localhost grafana]# vim grafana.ini 注意:发件邮件要开启smtp服 ...

  5. uni-app微信小程序文本框计数功能

    <view> <textarea placeholder="请输入" @input="sumfontnum" :maxlength=" ...

  6. 执行helm list 提示kube/config 告警问题

    1.现象 WARNING: Kubernetes configuration file is group-readable. This is insecure. Location: /root/.ku ...

  7. C#/.Net 部分缩写

    CTS(Common Type System):通用类型系统:指定最基本类型便于.Net Framework的各种语言之间进行交互. CLR(Common Language Runtime):.Net ...

  8. C语言初级阶段5——函数2

    C语言初级阶段5--函数2 址传递 1.地址:在定义变量,数组,函数等等,系统会自动给分配他们的内存区域(地址),把这个数据放到这个地址上面. 2.&:&a 得到a的地址编号 3.*: ...

  9. CF1272 C Yet Another Broken Keyboard 题解+代码比对

    C. Yet Another Broken Keyboard time limit per test 2 seconds memory limit per test 256 megabytes inp ...

  10. ADB 命令 使用

    基本用法 命令语法 为命令指定目标设备 启动/停止 查看 adb 版本 以 root 权限运行 adbd 指定 adb server 的网络端口 设备连接管理 查询已连接设备/模拟器 USB 连接 无 ...