JavaWeb16-案例分页实现(Java真正的全栈开发)

案例 & 分页

一.案例

1. 删除选中分析

商品列表页面如下:

要求:

1.在表头上添加一个复选框.(列表全选或者全不选)

2.在list.jsp中添加一个删除选中的按钮,点击删除选中商品

2. 删除选中实现

全选或者全不选的实现

在表头上添加一个复选框

遍历商品的时候给每一个商品添加一个复选框,为了便于获取,给他们使用了name属性

编写js函数实现全选或者全不选

删除选中记录的实现

获取选中的记录,将选中的ids传递给DeleteProductByIdsServlet

为了方便获取选中记录的id,在复选框上添加value属性,值为当前记录的id

在点击删除选中按钮的时候,获取所有选中记录的id,传递到后台

实现方式两种:

方式1:手动拼url,在后台获取id参数

方式2:通过form表单,在后天获取name=’ck’的参数

将图书列表的tr放到一个form表单中,当点击’删除选中’,触发当前表单提交

DeleteProductByIdsServlet调用service,service调用dao,在到里执行批量操作

dao里的写法

3. 多条件查询商品分析

4. 多条件查询商品实现

dao条件查询写法

二.分页

1. 分页原理介绍

分页介绍

分页就是将数据以多页展示出来

分页作用

为了提高用户的感受

分页技术分类

物理分页

只从数据库中查询出要显示的数据

优点:不占用很多内存

缺点:速度比较低,每一次都要从数据库中获取

逻辑分页

从数据库中将所有记录查找到,存储到内存中,需要什么数据

直接从内存中获取.

优点:速度比较快

缺点:占用比较多的内存,如果数据比较多,可以出现内在溢出。

数据实时更新需要单独处理.

mysql中limit介绍

利用mysql的limit,进行物理分页。

格式1:

select * from 表名 limit m,n;

m是从0开始,代表是第几条记录

n代表显示多少条记录

可以理解从第m+1条记录到m+n条记录 闭合区间[m+1,m+n]

格式2:

select * from 表名 limit n;

可以理解为前n条记录

等价于:select * from 表名 limit 0,n;

例如

select * from person limit 4,10;

从第5条记录开始,显示10条.也就是[5,14]

分页实现原理分析

a.明确一共多少条记录

select coun(*) from 表;

b.明确每一页显示多少条记录

自己定义或者从前台传过来

c.计算一共多少页

计算方式1:总条数%每页条数==0?总条数/每页条数:总条数/每页条数+1

计算方式2:Math.ceil(总条数*1.0/每页条数)

d.查看第几页

默认第一页,从前台页面传过来

点击上一页下一页的时候,就是对当前页加或者减1操作

e.当前页码的数据

通过limit查询出数据

例如:每页显示5条,查询第3页数据

select * from 表 limit (3-1)*5,5;

用(当前页码-1)*每页条数,就求出了开始的记录位置,在向下查找每页数个记录。就得到了这页的数据.

2. 分页功能分析

执行流程:

a从index.jsp链接进入商品列表页面,默认访问第一页的数据,

b.发送至findProductsByPageServlet查询第一页数据,每页的条数默认为4条,

需要两个参数:当前页页码和每页显示的条数

c.调用productService的findProductsByPage(int 当前页,int 每页条数),返回值为bean对象.将当前页码,每页条数,总条数,总页数以及当前页的图书列表封装成pageBean,

d.将pagebean放到request域中,返回给product_list.jsp

e.在jsp页面将数据遍历

3. 分页功能实现

编写PageBean

private Integer currentPage;//当前页码

private Integer pageSize;//每页条数

private Integer totalPage;//总页数

private Integer totalCount;//总条数

private List<Product> list;//每页数据

编写servlet(分页查找)

编写productService中的分页查找方法,将查找出数据进行封装成pagebean

public PageBean findProductsByPage(int currentPage, int pageSize) throws SQLException {

//查找总条数

int totalCount=dao.getTotalCount();

//计算总页数

int totalPage=(int) Math.ceil(totalCount*1.0/pageSize);

//查询当前页数据

List<Product> list=dao.findProductsByPage(currentPage,pageSize);

//封装数据

PageBean bean=new PageBean(currentPage, pageSize, totalPage, totalCount, list);

return bean;

}

编写productDao中的方法

查看总条数

public int getTotalCount() throws SQLException {

QueryRunner runner = new QueryRunner(DataSourceUtils.getDateSource());

String sql="select count(*) from products";

return ((Long) runner.query(sql, new ScalarHandler())).intValue();

}

查看当前页数据

public List<Product> findProductsByPage(int currentPage, int pageSize) throws SQLException {

QueryRunner runner = new QueryRunner(DataSourceUtils.getDateSource());

String sql="select * from products limit ?,?";

return runner.query(sql, new BeanListHandler<Product>(Product.class), (currentPage-1)*pageSize,pageSize);

}

4. 设置分页条码

<c:if test="${pb.currentPage==1 }">

<li><<上一页</li>

</c:if>

<c:if test="${pb.currentPage!=1 }">

<li><a href="${pageContext.request.contextPath }/findProductsByPage?page=${pb.currentPage-1}"><<上一页</a></li>

</c:if>

<c:forEach begin="1" end="${pb.totalPage }" step="1" var="n">

<c:if test="${n == pb.currentPage}">

<li>${n }</li>

</c:if>

<c:if test="${n != pb.currentPage}">

<li><a href="${pageContext.request.contextPath }/findProductsByPage?page=${n}">${n }</a></li>

</c:if>

</c:forEach>

<c:if test="${pb.currentPage==pb.totalPage }">

<li>下一页>></li>

</c:if>

<c:if test="${pb.currentPage!=pb.totalPage }">

<li><a href="${pageContext.request.contextPath }/findProductsByPage?page=${pb.currentPage+1}">下一页>></a></li>

</c:if>

请点击此处输入图片描述

三.案例

1. 显示商品详情分析

2. 显示商品详情实现

页面:product_info.jsp

3. 将商品添加到购物车分析

在商品详情页面点击购买,将该商品添加到购物车.

购物车存放在哪儿?

session

购物车的数据结构是什么?

Map<Product,Integer>

如何保证购物车里物品的唯一性?

重写key的equals和hashcode方法

也就是说重写product的两个方法.(只需要判断id即可)

4. 将商品添加到购物车实现

修改product_info.jsp的”购买”链接

在add2cartServlet中将商品添加到购物车即可

5. 显示购物车中的商品信息分析

直接点击页面右上部的购物车即可,购物车的页面如下:

6. 显示购物车中的商品信息实现

只需要在页面中将购物车中的数据展示出来即可

遍历map

7. 修改购物车中商品数量分析

页面删有三个按钮,分别是添加一个,减少一个以及从购物车移除该商品

请点击此处输入图片描述请点击此处输入图片描述

添加的时候:

1.需要知道对那个商品就行操作的,并且个数是多少,因此在触发按钮的时候需要将id和个数传过去

2.修改的个数大于库存了或者小于0如何做?

思路:

需要在点击按钮的时候,将商品的库存数量一并传过去

当购买数量<=0时从购物车移走

当透明数量>=库存时,设成最大值

8. 修改购物车中商品数量实现

jsp页面的修改

a.在按钮上添加单击事件,将当前商品的id,count以及库存传过去

b.在js中判断数量>库存或者<=0时的操作

c.在点击删除按钮的时候,将数量置为0即可

修改项目名称


原文发布于微信公众号 - Java帮帮(javahelp)

原文发表时间:2017-02-04

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏菜鸟致敬

【菜鸟致敬】爬取豆瓣的短评(⊙o⊙)…

因为需要一点数据,所以就去爬取一点豆瓣短评的数据。因为短评页面是生成的静态html,还是很容易爬虫数据的,其中发现了问题每部电影短评在同一条件下最多只能查阅50...

13010
来自专栏后端云

RAID

RAID(Redundant Array of Independent Disks):独立冗余磁盘阵列,简称磁盘阵列。RAID是按照一定的形式和方案组织起来的存...

16770
来自专栏一个爱吃西瓜的程序员

爬取许嵩的所有微博并存入MongoDB

我很喜欢许嵩的音乐,我以前基本上他的每首歌都会唱,比如《素颜》、《灰色头像》、《玫瑰花的葬礼》、《清明雨上》、《庐州月》等等,打开播放器,基本上都是循环播放许嵩...

8820
来自专栏北京马哥教育

【精粹】基础 RAID 介绍

简介 RAID是一个我们经常能见到的名词。但却因为很少能在实际环境中体验,所以很难对其原理 能有很清楚的认识和掌握。本文将对RAID技术进行介绍和总结,以期能尽...

302100
来自专栏编程微刊

Jquery+Ajax+Bootstrap Paginator实现分页的拼接

48240
来自专栏林德熙的博客

win10 uwp 使用油墨输入 保存,修改,加载inkUWP 手写清理笔画手写识别无法识别手写语音

现在很多人还是使用笔和纸来记录,那么可以在电脑输入方式和之前使用的方式一样,很多用户觉得会方便。在win10 我们有一个简单的方法去让用户输入,InkCanva...

26410
来自专栏deepcc

chorme模拟微信浏览器

47880
来自专栏小詹同学

同样是追星 ,他们是这样做的 。

最近我朋友疯狂迷恋韩国的偶像团体防弹少年团,于是拜托我帮忙写一段程序实时检测韩国新闻网站instiz旗下两个板块pt和clip,当出现自家idol的新闻时,程序...

15160
来自专栏Java3y

移动商城第一篇【搭建项目环境+数据模型】

前言 本次该项目使用的技术如下: ? 这里写图片描述 搭建Oracle数据库环境 本次我们用Oracle作为我们的服务器,我们一般开发并不是把数据表放在我们练习...

51190
来自专栏更流畅、简洁的软件开发方式

【开源】我的分页控件正式命名为QuickPager ASP.NET2.0分页控件

分页控件正式命名为 QuickPager ASP.NET2.0分页控件 。 版本号:2.0.0.1 Framework:.net2.0 分页方式:PostB...

22550

扫码关注云+社区

领取腾讯云代金券