Javaweb分页技术实现

分页技术就是通过SQL语句(如下)来获取数据,具体实现看下面代码

//分页查询语句
select * from 表名 where limit page , count;

//获取表中的总数据,确定页数
select count(*) from 表名;

不说废话直接上代码

前端代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-3.3.1.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body> <div class="container">
<div class="row clearfix">
<div class="col-md-12 column">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>City_ID</th>
<th>City_EN</th>
<th>City_CN</th>
<th>Country_code</th>
<th>Country_EN</th>
<th>Country_CN</th>
<th>Province_EN</th>
<th>Province_CN</th>
</tr>
</thead>
<tbody id="tbody"> </tbody>
</table>
<!--分页-->
第<span id="paging">1</span>页/
共<span id="countPage">1</span>页/
<a id="homePage">Home</a>/
<a id="prevPage">Prev</a>/
<a id="nextPage">Next</a>/
转到第:
<input type="text" style="width: 2em" id="pageNum">

<a id="goPage">Go</a> </div>
</div>
</div>
</body>
<script>
$(function () {
//页面初始化 (显示第一页)
selectPage(1);
home();
prev();
next();
goPage();
})
function selectPage(pageCode) {
//分页查询 pageCode:页数
$.ajax("getCity",{
type:"get",
data:{"currenPage":pageCode},
success:function (data) {
$("#tbody").html("");
//总页数
$("#countPage").text(data.totalPage); $.each(data.pageData,function (index,obj) {
var clazz="";
if(index%2==0){
clazz="success";
}
$("#tbody").append(
"<tr class='"+clazz+"'>\n" +
"<td>"+obj.cityId+"</td>\n" +
"<td>"+obj.cityEn+"</td>\n" +
"<td>"+obj.cityCn+"</td>\n" +
"<td>"+obj.countryCode+"</td>\n" +
"<td>"+obj.countryEn+"</td>\n" +
"<td>"+obj.countryCn+"</td>\n" +
"<td>"+obj.provinceEn+"</td>\n" +
"<td>"+obj.provinceCn+"</td>\n" +
"</tr>"
);
}) }
});
}
//第一页
function home() {
$("#homePage").on("click",function () {
$("#paging").text(1);
selectPage(1);
})
} //上一页
function prev() {
$("#prevPage").on("click",function () {
var prevText=$("#paging").text();
var prevNum=parseInt(prevText);
prevNum=prevNum-1;
if(prevNum<=1){
selectPage(1);
$("#paging").text(1);
return;
}
$("#paging").text(prevNum);
selectPage(prevNum);
})
}
//下一页
function next() {
$("#nextPage").on("click",function () {
//获取文本的值 页数
var prevText=$("#paging").text();
//类型转换
var prevNum=parseInt(prevText);
//总页数
var countText=$("#countPage").text();
//类型转换
var countNum = parseInt(countText);
//页数加1
prevNum=prevNum+1;
//判断超出了总页码
if(prevNum>=countNum){
selectPage(countNum);
$("#paging").text(countNum);
return;
}
//设置网页增加的值
$("#paging").text(prevNum);
//调用分页查询
selectPage(prevNum);
})
}
//去到几页
function goPage() {
$("#goPage").on("click",function () {
var pageNum=parseInt($("#pageNum").val());
var countPage=parseInt($("#countPage").text())
//判断超出了总页码
if(pageNum>=countPage){
selectPage(countPage);
$("#paging").text(countPage);
$("#pageNum").val(countPage);
return;
}
//判断低于了总页码
if(pageNum<=1){
selectPage(1);
$("#paging").text(1);
$("#pageNum").val(1);
return;
}
selectPage(pageNum);
$("#paging").text(pageNum);
})
} </script>
</html>

后台servlet代码:

/**
* @author hh
* @Date 2018/9/12
*/
@WebServlet("/getCity")
public class PageServlet extends HttpServlet {
@Override
protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//获取当前页参数,第一次访问为空
String currPage = req.getParameter("currenPage");
// 判断,如果为空,则设置为1
if (currPage == null || "".equals(currPage.trim())) {
currPage = "1";
}
//调用service返回分页类实例
PageBean<City> pageBean=new PageService().getPage(currPage);
//设置相应文本类型
resp.setContentType("application/json;charset=utf-8");
//响应前端
resp.getWriter().print(new Gson().toJson(pageBean));
}
}

City 实体类:

package edu.nf.demo.entity;

/**
* @author hh
* @Date 2018/9/12
*/
public class City {
private String cityId;
private String cityEn;
private String cityCn;
private String countryCode;
private String countryEn;
private String countryCn;
private String provinceEn;
private String provinceCn; public String getCityId() {
return cityId;
} public void setCityId(String cityId) {
this.cityId = cityId;
} public String getCityEn() {
return cityEn;
} public void setCityEn(String cityEn) {
this.cityEn = cityEn;
} public String getCityCn() {
return cityCn;
} public void setCityCn(String cityCn) {
this.cityCn = cityCn;
} public String getCountryCode() {
return countryCode;
} public void setCountryCode(String countryCode) {
this.countryCode = countryCode;
} public String getCountryEn() {
return countryEn;
} public void setCountryEn(String countryEn) {
this.countryEn = countryEn;
} public String getCountryCn() {
return countryCn;
} public void setCountryCn(String countryCn) {
this.countryCn = countryCn;
} public String getProvinceEn() {
return provinceEn;
} public void setProvinceEn(String provinceEn) {
this.provinceEn = provinceEn;
} public String getProvinceCn() {
return provinceCn;
} public void setProvinceCn(String provinceCn) {
this.provinceCn = provinceCn;
}
}

自己写的一个类,专门用于分页查询用的:

package edu.nf.demo.entity;

import java.util.List;

/**
* @author hh
* @Date 2018/9/12
*/
public class PageBean<T> {
/**
* 当前页, 默认显示第一页
*/
private Integer currntPage = 1;
/**
* 查询返回的行数(每页显示的行数),默认每页显示10行
*/
private int pageCount = 10;
/**
* 总记录数
*/
private int totalCount;
/**
* 总页数 = 总记录数/每页显示的行数(+1)
*/
private int totalPage;
/**
* 分页查询的数据,运用泛型,可以重复利用
*/
private List<T> pageData; public int getTotalPage() {
if (totalCount % pageCount == 0) {
totalPage = totalCount / pageCount;
} else {
totalPage = totalCount / pageCount + 1;
}
return totalPage;
} public void setTotalPage(int totalPage) {
this.totalPage = totalPage;
} public int getCurrntPage() {
return currntPage;
} public void setCurrntPage(int currntPage) {
this.currntPage = currntPage;
} public int getPageCount() {
return pageCount;
} public void setPageCount(int pageCount) {
this.pageCount = pageCount;
} public int getTotalCount() {
return totalCount;
} public void setTotalCount(int totalCount) {
this.totalCount = totalCount;
} public List<T> getPageData() {
return pageData;
} public void setPageData(List<T> pageData) {
this.pageData = pageData;
}
}

后台service,逻辑业务层:

/**
* @author hh
* @Date 2018/9/12
*/
public class PageService { public PageBean getPage(String currPage){
//类型转换 当前页数
Integer currenPage = Integer.valueOf(currPage);
//实例化分页类
PageBean<City> pageBean = new PageBean();
//实例化CityDaoImpl类
CityDaoImpl cityDao=new CityDaoImpl(); //数据库第几行开始查询
int startPage=(currenPage-1)*pageBean.getPageCount();
//查询多少行数据 分页类里默认30行
int selectCount=pageBean.getPageCount();
//查询数据库获取分页返回的数据 : select * from regional_info limit startPage,selectCount
List<City> list=cityDao.listCity(startPage,selectCount);
//获取总数
int cityCount=cityDao.getCityCount();
//设置查询的数据
pageBean.setPageData(list);
//共多少行
pageBean.setTotalCount(cityCount);
//设置总页数
pageBean.setTotalPage(cityCount/pageBean.getPageCount()+1);
return pageBean;
}
}

javaweb分页查询实现的更多相关文章

  1. JavaWeb分页显示内容之分页查询的三种思路(数据库分页查询)

    转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6134851.html 在开发过程中,经常做的一件事,也是最基本的事,就是从数据库中查询数据,然后在客户端显示出 ...

  2. 基于Mysql数据库的SSM分页查询

    前言: Hello,本Y又来了,"分页"在我们使用软件的过程中是一个很常见的场景,比如博客园对于每个博主的博客都进行了分页展示.可以简单清晰的展示数据,防止一下子将过多的数据展现给 ...

  3. JdbcTemplate+PageImpl实现多表分页查询

    一.基础实体 @MappedSuperclass public abstract class AbsIdEntity implements Serializable { private static ...

  4. 用Hibernate和Struts2+jsp实现分页查询、修改删除

    1.首先用get的方法传递一个页数过去 2.通过Struts2跳转到Action 3.通过request接受主页面index传过的页数,此时页数是1, 然后调用service层的方法获取DAO层分页查 ...

  5. MySQL、Oracle和SQL Server的分页查询语句

    假设当前是第PageNo页,每页有PageSize条记录,现在分别用Mysql.Oracle和SQL Server分页查询student表. 1.Mysql的分页查询: SELECT * FROM s ...

  6. 分页查询和分页缓存查询,List<Map<String, Object>>遍历和Map遍历

    分页查询 String sql = "返回所有符合条件记录的待分页SQL语句"; int start = (page - 1) * limit + 1; int end = pag ...

  7. mysql 分页查询

    mysql,; : mysql,; -last. //如果只给定一个参数,它表示返回最大的记录行数目: mysql; 个记录行 ,n. 动态传参的分页查询 SELECT * FROM table LI ...

  8. MongoDB 分页查询的方法及性能

    最近有点忙,本来有好多东西可以总结,Redis系列其实还应该有四.五.六...不过<Redis in Action>还没读完,等读完再来总结,不然太水,对不起读者. 自从上次Redis之后 ...

  9. .NET平台开源项目速览(7)关于NoSQL数据库LiteDB的分页查询解决过程

    在文章:这些.NET开源项目你知道吗?让.NET开源来得更加猛烈些吧!(第二辑) 与 .NET平台开源项目速览(3)小巧轻量级NoSQL文件数据库LiteDB中,介绍了LiteDB的基本使用情况以及部 ...

随机推荐

  1. 函数式编程之-拒绝空引用异常(Option类型)

    众多语言都会设计Option类型,例如Java 8和Swift都设计了Optional类型.其实这种类型早就出现在了函数式语言中,在OCaml和Scala中叫Option,在Haskell中叫Mayb ...

  2. SpringCloud学习5-如何创建一个服务提供者provider

    前几篇主要集中在注册中心eureka的使用上,接下来可以创建服务提供者provider来注册到eureka. demo源码见: https://github.com/Ryan-Miao/spring- ...

  3. 进程间通信IPC-消息队列

    前言: 消息队列就是一个消息的链表.可以把消息看作一个记录,具有特定的格式以及特定的优先级.对消息队列有写权限的进程可以向其中按照一定的规则添加新消息:对消息队列有读权限的进程则可以从消息队列中读走消 ...

  4. 利用redis实现分布式锁

    分布式锁一般有三种实现方式: 1. 数据库乐观锁: 2. 基于ZooKeeper的分布式锁: 3. 基于Redis的分布式锁: 这里大概说一下三种方式的优缺点,数据库乐观锁优点是实现简单,只需要for ...

  5. 基于SSM框架贺州学院校园二手交易平台设计与实现

    前言 这个是我当时的毕业论文,分享出来,给同学们参考. 绪论 随着中国新四大发明的诞生,网购成了千千万万网友们购物的新方式,新的购物方式促进商业的发展,但随着人们生活水平的提高,许多新购置的物品用了没 ...

  6. “每日一道面试题”.Net中GC的运行机制

    GC 也就是垃圾回收,经常遇到的面试题,关于GC 感觉可以写一本书,我们要做的也就是简单理解,如果有意愿,可以深入研究 所谓的垃圾回收,也就是清理回收托管堆上不再被使用的对象内存,并且移动仍在被使用的 ...

  7. JQuery官方学习资料(译):遍历

        一旦你通过JQuery创建了选择器,你就可以对此进行更为深入的遍历.遍历可以分为三个基本组成部分,父节点.子节点和兄弟节点.JQuery为这些部分提供了许多丰富易用的方法. <div c ...

  8. 从零开始学安全(九)●OSI参考模型分层

    主要分为7层和网络7层模型一样 物理层主要传输数据比特流  可以理解信号 数据链路层   逻辑层  像是交换机 网络层    又交换机发送到路由器 应用层 应用通信

  9. [PHP] 理解依赖注入

    两个类有依赖关系的时候 使用者通过构造函数参数,方法或属性等方式将具体组件,传给自己 $storage=new Storge(); //构造函数注入 class User{ public functi ...

  10. springboot调优

    application.properties server.tomcat.max-connections=0 # Maximum number of connections that the serv ...