分页操作例子

最新推荐文章于 2023-06-27 17:27:12 发布

一个不会编程的

最新推荐文章于 2023-06-27 17:27:12 发布

阅读量287

点赞数

分类专栏： JAVAWEB基础

本文链接：https://blog.csdn.net/qq_44878991/article/details/110871272

版权

JAVAWEB基础专栏收录该内容

19 篇文章 1 订阅

订阅专栏

分页介绍

有两种：
1.物理分页：使用数据库本身提供的分页操作来完成数据查询，查询到的就是当前页的信息。例如mysql可以使用limit oracle数据库可以使用rownum来宛成。这种方案的优点是性能比较好，但是它存在不通用问题。
2逻辑分页：它是利用数据库的游标来操作（将数据库所有数据都查询出来，存储在内存中），性能比较低，但是它通用。
现在开发中一般使用的比较多的是物理分页。

分页实现可以使用ajax分页，也可以使用服务器端分页，它们原理是一样的。
Mysql中的limit如何完成分页数据查询操作。select * from 表名 limit num1,num2;
Num1代表的是从第几行开始查询，起始值是0
Num2代表的是要查询几条记录。
例如查询第二页数据(每页显示5条)
Select * from product limit (页码-1)*每页条数 , (每页条数);

完成分页操作必备条件:
1．页码pageNo默认是1会根据上一页，下一页，首页尾页选择变化，我
们通过js来控制。
2.每页显示条数pageSize人为设置。
3.总条数
4.总页数=总条数/每页显示条数 (要取整)
5.封装当前页的数据

javaee三层架构介绍

在这里插入图片描述
Web层:它主要包含的关于javaweb相关操作，例如request,response,session对象操作，它
调用业务层来实现具体的功能。
业务层(service层):它主要是业务逻辑操作，它不包含web常用对象，它只是java代码。
数据访问层(dao层):它主要是与数据库进行交互，完成crud 操作。

bootstrap分页组件介绍

注意:在使用bootstrap的分页组件时，需要导入相关的css,文件与js.文件，并且 bootstrap它依赖于jquery,在导入 bootstrap 的js,文件前要导入jquery的js,文件,并且它的版本要求必须是1.9.1以上版本!

代码示例：
Product.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap 101 Template</title>
<link href="/jquery/css/bootstrap.min.css" rel="stylesheet">
<script src="/jquery/js/jquery.min.js"></script>
<script src="/jquery/js/bootstrap.min.js"></script>
<script type="text/javascript">

	var pageNo = 1;//默认第一页
	var pageSize = 5;//每页显示条数
	var totalPage=5;
	var totalCount=0;

	//页面加载完成后，要向服务器发送请求，获取产品信息，在table中显示出来
	$(function(){
		skipPage(pageNo);	
	});

	function skipPage(pageNum) {
		pageNo = pageNum;

		
		var url="/jquery/Product";
		$.post(url,{"pageNo":pageNo,"pageSize":pageSize},function(data){
			var json = eval(data);
			var jsonObj = json.content;//得到分页数据
			//与服务器数据同步
			pageNo = json.pageNo;
			pageSize = json.pageSize;
			totalPage = json.totalPage;
			totalCount = json.totalCount;
			
			
			var html = "";
			for(var i=0;i<jsonObj.length;i++){
				html+="<tr>";
				html+="<td>"+jsonObj[i].id+"</td><td>"+jsonObj[i].name+"</td><td>"+jsonObj[i].count+"</td><td>"+jsonObj[i].price+"</td>";
				html+="</tr>";
			}
			
			var pageMsg = "<ul class='pagination pagination-sm'>";
			//处理上一页操作
			if(pageNo==1){
				//上一页操作不能点击
				pageMsg+="<li class='disabled'><a href='#' aria-label='Previous'><spanaria-hidden='true'>&laquo;</span></a></li>";
			}else{
				pageMsg+="<li><a href='javascript:void(0)' aria-label='Previous' οnclick='skipPage("+(pageNo-1)+")'><spanaria-hidden='true'>&laquo;</span></a></li>";
			}
			
			for(var i=1;i<=totalPage;i++){
				if(i == pageNo){
					pageMsg+="<li class='active'><a href='javascript:void(0)' οnclick='skipPage("+i+")'>"+i+"<span class='sr-only'>(current)</span></a></li>";
				}else{
					pageMsg+="<li><a href='javascript:void(0)' οnclick='skipPage("+i+")'>"+i+"</a></li>";
				}
				
			}
			//处理下一页操作
			if(pageNo==totalPage){
				//下一页操作不能点击
				pageMsg+="<li class='disabled'><a href='#' aria-label='Previous'>&raquo;</a></li>";
			}else{
				pageMsg+="<li><a href='javascript:void(0)' aria-label='Previous' οnclick='skipPage("+(pageNo+1)+")'>&raquo;</a></li>";
			}
			pageMsg+="</ul>";
			
			$("#tab").html("<tr><td>序号</td><td>名称</td><td>数量</td><td>价格</td></tr><tr><td colspan='4'><nav id='n'></nav></td></tr>");
			
			$("#n").append(pageMsg);
			$("#tab tr:nth-child(1)").after(html);
			
			
		},"json");		
	}
</script>
<style type="text/css">
	div{
		width: 70%;
		margin-left: 200px;
		margin-top: 100px;
	}
</style>
</head>
<body>
	<div align="center">
		<table class="table table-bordered" id="tab">
			<tr>
				<td>序号</td>
				<td>名称</td>
				<td>数量</td>
				<td>价格</td>
			</tr>

			<tr>
				<td colspan="4">
					<nav id="n"></nav>
				</td>
			</tr>
		</table>


	</div>
</body>
</html>

Product.java

package com.servlet;

import java.io.IOException;
import java.sql.SQLException;
import java.util.List;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.alibaba.fastjson.JSONObject;
import com.domain.PageBean;

public class Product extends HttpServlet {

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		//处理中文乱码
		response.setCharacterEncoding("utf-8");
		
		//接受请求参数的pageNo pageSize
		int pageNo = Integer.parseInt(request.getParameter("pageNo"));//页码
		int pageSize = Integer.parseInt(request.getParameter("pageSize"));//每页显示条数
		
		
		ProductService service = new ProductService();
		try {
			PageBean pb = service.findAll(pageNo,pageSize);
			//将ps转换成json响应到浏览器
			String json = JSONObject.toJSONString(pb);
			response.getWriter().write(json);
			
		} catch (SQLException e) {
			e.printStackTrace();
			//向浏览器发送一条描述错误信息的json数据
		}
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}

}

ProductService

package com.servlet;

import java.sql.SQLException;
import java.util.List;

import com.domain.PageBean;
import com.domain.Product;

public class ProductService {
	public PageBean findAll(int pageNo,int pageSize) throws SQLException {
		ProductDAO dao = new ProductDAO();
		List<Product> ps = dao.findAll(pageNo,pageSize);
		PageBean<Product> pb = new PageBean<Product>();
		pb.setPageNo(pageNo);
		pb.setPageSize(pageSize);
		pb.setContent(ps);
		int totalCount = dao.findAllCount();
		int totalPage = (int) Math.ceil(totalCount*1.0/pageSize);
		pb.setTotalCount(totalCount);
		pb.setTotalPage(totalPage);
		return pb;
	}
	
}

ProductDAO

package com.servlet;

import java.sql.SQLException;
import java.util.List;

import org.apache.commons.dbutils.QueryRunner;
import org.apache.commons.dbutils.handlers.BeanListHandler;
import org.apache.commons.dbutils.handlers.ScalarHandler;

import com.domain.Product;
import com.util.JDBCUtils2;

public class ProductDAO {
	public List<Product> findAll(int pageNo,int pageSize) throws SQLException {
		QueryRunner runner = new QueryRunner(JDBCUtils2.getDataSource());
		return runner.query("select * from product limit ?,?", new BeanListHandler<Product>(Product.class),(pageNo-1)*pageSize,pageSize);
	}

	public int findAllCount() throws SQLException {
		QueryRunner runner = new QueryRunner(JDBCUtils2.getDataSource());
		return ((Long) runner.query("select count(*) from product", new ScalarHandler())).intValue();
	}
}

PageBean< T >

package com.domain;

import java.util.List;

public class PageBean<T> {
	private int pageNo; //页码
	private int pageSize;//每页显示条数
	private int totalPage;//总页数
	private int totalCount;//总条数
	private List<T> content;//当前页显示数据
	public int getPageNo() {
		return pageNo;
	}
	public void setPageNo(int pageNo) {
		this.pageNo = pageNo;
	}
	public int getPageSize() {
		return pageSize;
	}
	public void setPageSize(int pageSize) {
		this.pageSize = pageSize;
	}
	public int getTotalPage() {
		return totalPage;
	}
	public void setTotalPage(int totalPage) {
		this.totalPage = totalPage;
	}
	public int getTotalCount() {
		return totalCount;
	}
	public void setTotalCount(int totalCount) {
		this.totalCount = totalCount;
	}
	public List<T> getContent() {
		return content;
	}
	public void setContent(List<T> content) {
		this.content = content;
	}
	
}

运行如下图：并且可以点击
在这里插入图片描述

一个不会编程的

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分页操作例子

分页介绍有两种：1.物理分页：使用数据库本身提供的分页操作来完成数据查询，查询到的就是当前页的信息。例如mysql可以使用limit oracle数据库可以使用rownum来宛成。这种方案的优点是性能比较好，但是它存在不通用问题。2逻辑分页：它是利用数据库的游标来操作（将数据库所有数据都查询出来，存储在内存中），性能比较低，但是它通用。现在开发中一般使用的比较多的是物理分页。分页实现可以使用ajax分页，也可以使用服务器端分页，它们原理是一样的。Mysql中的limit如何完成分页数据查询操作。
复制链接

扫一扫