查看: 316|回复: 0

[Java代码] java ssm框架实现分页功能的示例代码(oracle)

发表于 2018-4-14 08:00:02

java web 实现分页功能,分享给大家,具体如下:

使用框架:ssm

数据库:oracle

话说 oracle 的分页查询比 mysql 复杂多了,在这里简单谈一下:

查询 前十条数据:

  1. SELECT * FROM(
  2. SELECT ROWNUM WN,RN.* FROM (
  3. SELECT
  4. id,
  5. title,
  6. create_time as createTime,
  7. musictor,
  8. musictitle
  9. FROM
  10. krry_blog
  11. ORDER BY create_time desc
  12. )RN
  13. )WN
  14. WHERE WN <= 10 AND WN > 0
复制代码

语法较为复杂,

同样的结果,mysql 的语法是:用一个 LIMIT 就可以解决。

  1. SELECT
  2. id,
  3. title,
  4. create_time as createTime,
  5. musictor,
  6. musictitle
  7. FROM
  8. krry_blog
  9. ORDER BY create_time desc
  10. LIMIT 0,5
复制代码

SSM 框架的搭建,就不多说了,以前的博客有详细介绍,这里就谈谈实现 java web 分页的功能。

用到插件 js : krry_page.js,还有jQuery

mapper 持久层:

BlogMapper.java

  1. package com.krry.mapper;
  2. import java.util.HashMap;
  3. import java.util.List;
  4. import com.krry.entity.Params;
  5. /**
  6. *
  7. * Mapper:操作数据库
  8. * @author krry
  9. * @version 1.0.0
  10. *
  11. */
  12. public interface BlogMapper {
  13. /**
  14. * 查询所有博客
  15. * @param params
  16. * @return
  17. */
  18. public List<HashMap<String, Object>> findBlogs(Params params);
  19. /**
  20. * 计算博客数量
  21. * com.krry.dao.admin
  22. * 方法名:countBlogs
  23. * @author krry
  24. * @param params
  25. * @return int
  26. * @exception
  27. * @since 1.0.0
  28. */
  29. public long countBlogs();
  30. }
复制代码

BlogMapper.xml

  1. <?xml version="1.0" encoding="UTF-8" ?>
  2. <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
  3. "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
  4. <mapper namespace="com.krry.mapper.BlogMapper" >
  5. <!-- 分页查询所有的博客信息 -->
  6. <select id="findBlogs" resultType="java.util.HashMap" parameterType="Params">
  7. SELECT * FROM(
  8. SELECT ROWNUM WN,RN.* FROM (
  9. SELECT
  10. id,
  11. title,
  12. create_time as createTime,
  13. musictor,
  14. musictitle
  15. FROM
  16. krry_blog
  17. ORDER BY create_time desc
  18. )RN
  19. )WN
  20. WHERE WN <= #{pageSize} AND WN > #{pageNo}
  21. </select>
  22. <!-- 查询博客数量 -->
  23. <select id="countBlogs" resultType="long">
  24. SELECT
  25. count(*)
  26. FROM
  27. krry_blog
  28. </select>
  29. </mapper>
复制代码

service业务层:

接口类:IBlogService.java

  1. package com.krry.service;
  2. import java.util.HashMap;
  3. import java.util.List;
  4. import javax.servlet.http.HttpServletRequest;
  5. import org.apache.ibatis.annotations.Param;
  6. import com.krry.entity.Blog;
  7. import com.krry.entity.Params;
  8. /**
  9. * service层:处理业务逻辑(impl里面实现)
  10. * @author asusaad
  11. *
  12. */
  13. public interface IBlogService {
  14. /**
  15. * 分页查询所有博客
  16. * @param params
  17. * @return
  18. */
  19. public List<HashMap<String, Object>> findBlogs(Params params);
  20. /**
  21. * 计算博客数量
  22. * @param params
  23. * @return
  24. */
  25. public long countBlogs();
  26. }
复制代码

impl 实现类:BlogService.java

  1. package com.krry.service.impl;
  2. import java.util.HashMap;
  3. import java.util.List;
  4. import org.springframework.beans.factory.annotation.Autowired;
  5. import org.springframework.stereotype.Service;
  6. import org.springframework.web.servlet.ModelAndView;
  7. import com.krry.entity.Params;
  8. import com.krry.mapper.BlogMapper;
  9. import com.krry.service.IBlogService;
  10. /**
  11. * 实现service层接口
  12. * @author asusaad
  13. *
  14. */
  15. @Service
  16. public class BlogService implements IBlogService{
  17. @Autowired
  18. private BlogMapper blogMapper;
  19. /**
  20. * 查询博客
  21. */
  22. public List<HashMap<String, Object>> findBlogs(Params params) {
  23. //查询博客信息
  24. List<HashMap<String, Object>> blog = blogMapper.findBlogs(params);
  25. return blog;
  26. }
  27. /**
  28. * 计算博客数量
  29. * @param params
  30. * @return
  31. */
  32. public long countBlogs(){
  33. long coutBlogs = blogMapper.countBlogs();
  34. return coutBlogs;
  35. }
  36. }
复制代码

controller控制层:

KrryController.java

  1. package com.krry.controller;
  2. import java.util.HashMap;
  3. import java.util.List;
  4. import org.springframework.beans.factory.annotation.Autowired;
  5. import org.springframework.stereotype.Controller;
  6. import org.springframework.web.bind.annotation.RequestMapping;
  7. import org.springframework.web.bind.annotation.ResponseBody;
  8. import org.springframework.web.servlet.ModelAndView;
  9. import com.krry.entity.Params;
  10. import com.krry.service.IBlogService;
  11. /**
  12. * KrryController
  13. * controller层,作为请求转发
  14. * @author asusaad
  15. *
  16. */
  17. @Controller //表示是多例模式,每个用户返回的web层是不一样的
  18. public class KrryController {
  19. @Autowired
  20. private IBlogService blogService;
  21. /**
  22. * 首页,并且分页查询
  23. * @return
  24. */
  25. @RequestMapping("/index")
  26. public ModelAndView index(Params params){
  27. params.setPageNo(0);
  28. params.setPageSize(10); //一开始只查询10条
  29. //调用业务层
  30. List<HashMap<String, Object>> blogs = blogService.findBlogs(params);
  31. //查询博客数量
  32. long coutBlogs = blogService.countBlogs();
  33. ModelAndView modelAndView = new ModelAndView();
  34. modelAndView.addObject("blogs", blogs);
  35. modelAndView.addObject("coutBlogs", coutBlogs);
  36. modelAndView.setViewName("index");
  37. return modelAndView;
  38. }
  39. /**
  40. * ajax请求 的 分页查询
  41. * @param params
  42. * @return
  43. */
  44. @ResponseBody
  45. @RequestMapping("/loadData")
  46. public HashMap<String, Object> loadData(Params params){
  47. HashMap<String, Object> map = new HashMap<String, Object>();
  48. List<HashMap<String, Object>> blogs = blogService.findBlogs(params);
  49. map.put("blogs", blogs);
  50. return map;
  51. }
  52. }
复制代码

这里要有两个实体类,作为数据库查询的注入 Blog,还有分页查询的两个参数 Params:

设置data参数:pageNo(下一页):就是当前页数 * 下一页要显示的数量
       pageSize(下一页):已经查询出来的数量(pageNo) + 每页要显示的数量

在数据库中是 WN <= pageSize and WN > pageNo 来查询分页数据

Blog.java

  1. package com.krry.entity;
  2. /**
  3. *
  4. * User
  5. * @author krry
  6. * @version 1.0.0
  7. *
  8. */
  9. public class Blog {
  10. // 主键
  11. private String id;
  12. //博客标题
  13. private String title;
  14. //音乐作者
  15. private String musictor;
  16. //音乐标题
  17. private String musictitle;
  18. //创建时间
  19. private String createTime;
  20. public Blog(String id, String title, String musictor, String musictitle,
  21. String createTime) {
  22. this.id = id;
  23. this.title = title;
  24. this.musictor = musictor;
  25. this.musictitle = musictitle;
  26. this.createTime = createTime;
  27. }
  28. public String getId() {
  29. return id;
  30. }
  31. public void setId(String id) {
  32. this.id = id;
  33. }
  34. public String getTitle() {
  35. return title;
  36. }
  37. public void setTitle(String title) {
  38. this.title = title;
  39. }
  40. public String getMusictor() {
  41. return musictor;
  42. }
  43. public void setMusictor(String musictor) {
  44. this.musictor = musictor;
  45. }
  46. public String getMusictitle() {
  47. return musictitle;
  48. }
  49. public void setMusictitle(String musictitle) {
  50. this.musictitle = musictitle;
  51. }
  52. public String getCreateTime() {
  53. return createTime;
  54. }
  55. public void setCreateTime(String createTime) {
  56. this.createTime = createTime;
  57. }
  58. }
复制代码

Params.java

  1. package com.krry.entity;
  2. /**
  3. *
  4. * Params
  5. * @author krry
  6. * @version 1.0.0
  7. *
  8. */
  9. public class Params {
  10. private Integer pageSize = 0;
  11. private Integer pageNo = 0;
  12. public Integer getPageNo() {
  13. return pageNo;
  14. }
  15. public void setPageNo(Integer pageNo) {
  16. this.pageNo = pageNo;
  17. }
  18. public Integer getPageSize() {
  19. return pageSize;
  20. }
  21. public void setPageSize(Integer pageSize) {
  22. this.pageSize = pageSize;
  23. }
  24. }
复制代码

web 页面 index.jsp

  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
  2. <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
  3. <%
  4. String path = request.getContextPath();
  5. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
  6. pageContext.setAttribute("basePath", basePath);
  7. %>
  8. <!DOCTYPE HTML>
  9. <html>
  10. <head>
  11. <title>分页</title>
  12. <style>
  13. body{background:url("resource/images/78788.jpg");background-size:cover;}
  14. .titless{font-size: 34px;text-align: center;color: black;margin-bottom: 16px;}
  15. .ke_tabbox{min-height:556px;width:900px;background:#f9f9f9;margin:20px auto 0;padding:6px;position:relative;}
  16. .ke_tabbox .sendMy{text-align: center;
  17. font-family: "微软雅黑";
  18. font-size: 28px;
  19. -webkit-text-fill-color: transparent;
  20. background: -webkit-gradient(linear,left top,left bottom,from(#FD8700),to(#FF00B1));
  21. -webkit-background-clip: text;
  22. margin:8px auto 0;line-height: 35px;}
  23. .ke_tabbox .ke_table{width:100%;margin-top: 26px;}
  24. .ke_tabbox th{background:#ccc;font-weight:bold;}
  25. .ke_tabbox .ke_table td,th{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;border:1px solid #fff;padding:4px 12px;color:#666;font-size:12px;}
  26. /*分页相关*/
  27. .tzPage{font-size: 12px;position: absolute;top: 480px;right: 0px;}
  28. #tbody tr:hover{background:#eaeaea;}
  29. #tbody .t_mode{padding-right:4px;}
  30. #tbody .t_avbiaoq:hover{color:#FF6857;transition:.4s}
  31. #tbody .t_dele{padding-left:4px;}
  32. .tzPage a{text-decoration:none;border:none;color:#7d7d7d;background-color:#f2f2f2;border-radius: 3px;}
  33. .tzPage a:hover{background:#dd5862;color:#FFF;}
  34. .tzPage a,.tzPage span{display:block;float:left;padding:0em 0.5em;margin-right:5px;margin-bottom:5px;min-width:1em;text-align:center;line-height: 22px;height: 22px;}
  35. .tzPage .current{background:#dd5862;color:#FFF;border:none;border-radius: 3px;}
  36. .tzPage .current.prev,.tzPage .current.next{color:#999;border:1px solid #e5e5e5;background:#fff;}
  37. .tm_psize_go{margin-right:4px;float:left;height:24px;line-height:33px;position:relative;border:1px solid #e5e5e5;color:#999}
  38. #tm_pagego{border-radius:3px;height:18px;width:30px;float:left;text-align:center;border:1px solid #e5e5e5;line-height: 22px;color:#999}
  39. .sortdesc{border-top:5px solid;width:0px;height:0px;display:inline-block;vertical-align:middle;border-right:5px solid transparent;border-left:5px solid transparent;margin-left:5px;}
  40. .sortasc{border-bottom:5px solid;width:0px;height:0px;display:inline-block;vertical-align:middle;border-right:5px solid transparent;border-left:5px solid transparent;margin-left:5px;}
  41. .red{color:red}
  42. .green{color:green}
  43. .hideAdd{height: 300px;
  44. text-align: center;
  45. line-height: 300px;
  46. margin-top: 16px;display:none;}
  47. .hideAdd a{font-size:28px;-webkit-text-fill-color:transparent;background: -webkit-gradient(linear,left top,left bottom,from(#FD0051),to(#A22C93));-webkit-background-clip: text;}
  48. </style>
  49. </head>
  50. <body>
  51. <div class="ke_tabbox">
  52. <p class="titless">分页展示</p>
  53. <table class="ke_table">
  54. <thead>
  55. <tr>
  56. <th style="width:25%">标题</th>
  57. <th style="width:25%">音乐人</th>
  58. <th style="width:30%">音乐标题</th>
  59. <th style="width:20%">发布时间</th>
  60. </tr>
  61. </thead>
  62. <tbody id="tbody" data-itemcount="${coutBlogs}">
  63. <c:forEach var="blog" items="${blogs}">
  64. <tr>
  65. <td><a class="t_avbiaoq" title="${blog.TITLE}">${blog.TITLE}</a></td>
  66. <td><a class="t_avbiaoq" title="${blog.MUSICTOR}">${blog.MUSICTOR}</a></td>
  67. <td><a class="t_avbiaoq" title="${blog.MUSICTITLE}">${blog.MUSICTITLE}</a></td>
  68. <td>${blog.CREATETIME}</td>
  69. </tr>
  70. </c:forEach>
  71. </tbody>
  72. </table>
  73. <div id="krryPage"></div>
  74. </div>
  75. <script type="text/javascript" src="${basePath}/resource/js/jquery-1.11.3.min.js"></script>
  76. <script type="text/javascript" src="${basePath}/resource/js/krry_page.js"></script>
  77. <script type="text/javascript">var basePath = "${basePath}";</script>
  78. <script type="text/javascript">
  79. var krryAdminBlog = {
  80. initPage:function(itemCount){
  81. $("#krryPage").tzPage(itemCount, {
  82. num_display_entries : 5, //主体页数
  83. num_edge_entries : 4,//边缘页数
  84. current_page : 0,//指明选中页码
  85. items_per_page : 10, //每页显示多少条
  86. prev_text : "上一页",
  87. next_text : "下一页",
  88. showGo:true,//显示
  89. showSelect:false,
  90. callback : function(pageNo, psize) {//会回传两个参数,第一个是当前页数,第二个是每页要显示的数量
  91. krryAdminBlog.loadData(pageNo,psize);
  92. }
  93. });
  94. },
  95. //设置data参数:pageNo(下一页):就是当前页数 * 下一页要显示的数量
  96. // pageSize(下一页):已经查询出来的数量(pageNo) + 每页要显示的数量
  97. //在数据库中是 WN <= pageSize and WN > pageNo 来查询分页数据
  98. loadData:function(pageNo,pageSize){
  99. pageNo = pageNo * pageSize;
  100. pageSize = pageNo + 10;
  101. $.ajax({
  102. type:"post",
  103. url:basePath+"/loadData",
  104. data:{pageNo:pageNo,pageSize:pageSize},
  105. success:function(data){
  106. if(data){
  107. var html = "";
  108. var blogArr = data.blogs;
  109. for(var i=0,len=blogArr.length;i < len;i++){
  110. var json = blogArr[i];
  111. html+= "<tr>"+
  112. " <td><a class='t_avbiaoq' title='"+json.TITLE+"'>"+json.TITLE+"</a></td>"+
  113. " <td><a class='t_avbiaoq' title='"+json.NAME+"'>"+json.MUSICTOR+"</a></td>"+
  114. " <td><a class='t_avbiaoq' title='"+json.MUSICTITLE+"'>"+json.MUSICTITLE+"</a></td>"+
  115. " <td>"+json.CREATETIME+"</td>"+
  116. "</tr>";
  117. }
  118. $("#tbody").html(html);
  119. }
  120. }
  121. });
  122. }
  123. };
  124. krryAdminBlog.initPage($("#tbody").data("itemcount"));
  125. </script>
  126. </body>
  127. </html>
复制代码

分页效果图:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持程序员之家。



回复

使用道具 举报