how2j.cn

下载区
文件名 文件大小
请先登录 19m
增值内容 19m
19m
使用站长秘制下载工具

工具版本兼容问题
分页单独拿出来讲解



7分6秒
本视频采用html5方式播放,如无法正常播放,请将浏览器升级至最新版本,推荐火狐,chrome,360浏览器。 如果装有迅雷,播放视频呈现直接下载状态,请调整 迅雷系统设置-基本设置-启动-监视全部浏览器 (去掉这个选项)。 chrome 的 视频下载插件会影响播放,如 IDM 等,请关闭或者切换其他浏览器

步骤 1 : 先运行,看到效果,再学习   
步骤 2 : 模仿和排错   
步骤 3 : 效果   
步骤 4 : Page.java   
步骤 5 : CategoryService   
步骤 6 : CategoryServiceImpl   
步骤 7 : CategoryAction   
步骤 8 : listCategory.jsp   
步骤 9 : 为了便于理解,先来一个简化了的adminPage.jsp   
步骤 10 : 完整版的adminPage.jsp   
步骤 11 : 自己做一遍   

步骤 1 :

先运行,看到效果,再学习

edit
增值内容,请先登录
完整的SSH模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSH一整套技术栈, 从无到有涵盖全部133个知识点,571个开发步骤, 充实SSH项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
增值内容,请先登录
完整的SSH模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSH一整套技术栈, 从无到有涵盖全部133个知识点,571个开发步骤, 充实SSH项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
先观察效果,这是对分类管理做了分页功能之后的效果,每页显示5条,一共两页,当前是第一页。

注: 没有图片是正常的,后续增加分类知识点会讲解如何上传图片
效果
Page这个类专门为分页提供必要信息
属性:
int start; 开始位置
int count; 每页显示的数量
int total; 总共有多少条数据
String param; 参数(这个属性在后续有用到,但是分类的分页查询里并没有用到,请忽略)
int defaultCount ; 默认每页显示5条

方法:
getTotalPage 根据 每页显示的数量count以及总共有多少条数据total,计算出总共有多少页
getLast 计算出最后一页的数值是多少
isHasPreviouse 判断是否有前一页
isHasNext 判断是否有后一页
package com.how2java.tmall.util; public class Page { int start; //开始页数 int count; //每页显示个数 int total; //总个数 String param; //参数 private static final int defaultCount = 5; //默认每页显示5条 public int getStart() { return start; } public void setStart(int start) { this.start = start; } public int getCount() { return count; } public void setCount(int count) { this.count = count; } public Page (){ count = defaultCount; } public Page(int start, int count) { super(); this.start = start; this.count = count; } public boolean isHasPreviouse(){ if(start==0) return false; return true; } public boolean isHasNext(){ if(start==getLast()) return false; return true; } public int getTotalPage(){ int totalPage; // 假设总数是50,是能够被5整除的,那么就有10页 if (0 == total % count) totalPage = total /count; // 假设总数是51,不能够被5整除的,那么就有11页 else totalPage = total / count + 1; if(0==totalPage) totalPage = 1; return totalPage; } public int getLast(){ int last; // 假设总数是50,是能够被5整除的,那么最后一页的开始就是45 if (0 == total % count) last = total - count; // 假设总数是51,不能够被5整除的,那么最后一页的开始就是50 else last = total - total % count; last = last<0?0:last; return last; } @Override public String toString() { return "Page [start=" + start + ", count=" + count + ", total=" + total + ", getStart()=" + getStart() + ", getCount()=" + getCount() + ", isHasPreviouse()=" + isHasPreviouse() + ", isHasNext()=" + isHasNext() + ", getTotalPage()=" + getTotalPage() + ", getLast()=" + getLast() + "]"; } public int getTotal() { return total; } public void setTotal(int total) { this.total = total; } public String getParam() { return param; } public void setParam(String param) { this.param = param; } }
增值内容,请先登录
完整的SSH模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSH一整套技术栈, 从无到有涵盖全部133个知识点,571个开发步骤, 充实SSH项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.service; import java.util.List; import com.how2java.tmall.pojo.Category; import com.how2java.tmall.util.Page; public interface CategoryService{ public List list(); public int total(); public List<Category> listByPage(Page page); }
package com.how2java.tmall.service;

import java.util.List;

import com.how2java.tmall.pojo.Category;
import com.how2java.tmall.util.Page;

public interface CategoryService{
	
	public List list();

	public int total();

	public List<Category> listByPage(Page page);
}
步骤 6 :

CategoryServiceImpl

edit
增值内容,请先登录
完整的SSH模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSH一整套技术栈, 从无到有涵盖全部133个知识点,571个开发步骤, 充实SSH项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.service.impl; import java.util.List; import org.hibernate.criterion.DetachedCriteria; import org.hibernate.criterion.Order; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; import com.how2java.tmall.dao.impl.DAOImpl; import com.how2java.tmall.pojo.Category; import com.how2java.tmall.service.CategoryService; import com.how2java.tmall.util.Page; @Service public class CategoryServiceImpl implements CategoryService { @Autowired DAOImpl dao; @Override public List list() { DetachedCriteria dc = DetachedCriteria.forClass(Category.class); dc.addOrder(Order.desc("id")); return dao.findByCriteria(dc); } @Override public int total() { String hql = "select count(*) from Category "; List<Long> l= dao.find(hql); if(l.isEmpty()) return 0; Long result= l.get(0); return result.intValue(); } @Override public List<Category> listByPage(Page page) { DetachedCriteria dc = DetachedCriteria.forClass(Category.class); dc.addOrder(Order.desc("id")); return dao.findByCriteria(dc,page.getStart(),page.getCount()); } }
增值内容,请先登录
完整的SSH模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSH一整套技术栈, 从无到有涵盖全部133个知识点,571个开发步骤, 充实SSH项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
package com.how2java.tmall.action; import java.util.List; import org.apache.struts2.convention.annotation.Action; import org.apache.struts2.convention.annotation.Namespace; import org.apache.struts2.convention.annotation.ParentPackage; import org.apache.struts2.convention.annotation.Result; import org.apache.struts2.convention.annotation.Results; import org.springframework.beans.factory.annotation.Autowired; import com.how2java.tmall.pojo.Category; import com.how2java.tmall.service.CategoryService; import com.how2java.tmall.util.Page; @Namespace("/") @ParentPackage("basicstruts") @Results( { /*分类管理*/ @Result(name="listCategory", location="/admin/listCategory.jsp"), }) public class CategoryAction { @Autowired CategoryService categoryService; List<Category> categorys; Page page; @Action("admin_category_list") public String list() { if(page==null) page = new Page(); int total = categoryService.total(); page.setTotal(total); categorys = categoryService.listByPage(page); return "listCategory"; } public List<Category> getCategorys() { return categorys; } public void setCategorys(List<Category> categorys) { this.categorys = categorys; } public Page getPage() { return page; } public void setPage(Page page) { this.page = page; } }
增值内容,请先登录
完整的SSH模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSH一整套技术栈, 从无到有涵盖全部133个知识点,571个开发步骤, 充实SSH项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" import="java.util.*"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <%@include file="../include/admin/adminHeader.jsp"%> <%@include file="../include/admin/adminNavigator.jsp"%> <script> $(function(){ $("#addForm").submit(function(){ if(!checkEmpty("name","分类名称")) return false; if(!checkEmpty("categoryPic","分类上传图片")) return false; return true; }); }); </script> <title>分类管理</title> <div class="workingArea"> <h1 class="label label-info" >分类管理</h1> <br> <br> <div class="listDataTableDiv"> <table class="table table-striped table-bordered table-hover table-condensed"> <thead> <tr class="success"> <th>ID</th> <th>图片</th> <th>分类名称</th> <th>属性管理</th> <th>产品管理</th> <th>编辑</th> <th>删除</th> </tr> </thead> <tbody> <c:forEach items="${categorys}" var="c"> <tr> <td>${c.id}</td> <td><img height="40px" src="img/category/${c.id}.jpg"></td> <td>${c.name}</td> <td><a href="admin_property_list?category.id=${c.id}"><span class="glyphicon glyphicon-th-list"></span></a></td> <td><a href="admin_product_list?category.id=${c.id}"><span class="glyphicon glyphicon-shopping-cart"></span></a></td> <td><a href="admin_category_edit?category.id=${c.id}"><span class="glyphicon glyphicon-edit"></span></a></td> <td><a deleteLink="true" href="admin_category_delete?category.id=${c.id}"><span class=" glyphicon glyphicon-trash"></span></a></td> </tr> </c:forEach> </tbody> </table> </div> <div class="pageDiv"> <%@include file="../include/admin/adminPage.jsp" %> </div> <div class="panel panel-warning addDiv"> <div class="panel-heading">新增分类</div> <div class="panel-body"> <form method="post" id="addForm" action="admin_category_add" enctype="multipart/form-data"> <table class="addTable"> <tr> <td>分类名称</td> <td><input id="name" name="category.name" type="text" class="form-control"></td> </tr> <tr> <td>分类圖片</td> <td> <input id="categoryPic" type="file" name="img" /> </td> </tr> <tr class="submitTR"> <td colspan="2" align="center"> <button type="submit" class="btn btn-success">提 交</button> </td> </tr> </table> </form> </div> </div> </div> <%@include file="../include/admin/adminFooter.jsp"%>
步骤 9 :

为了便于理解,先来一个简化了的adminPage.jsp

edit
增值内容,请先登录
完整的SSH模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSH一整套技术栈, 从无到有涵盖全部133个知识点,571个开发步骤, 充实SSH项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false"%> <script> $(function(){ $("ul.pagination li.disabled a").click(function(){ return false; }); }); </script> <nav> <ul class="pagination"> <li> <a href="?page.start=0" aria-label="Previous" > <span aria-hidden="true">«</span> </a> </li> <li > <a href="?page.start=${page.start-page.count}" aria-label="Previous" > <span aria-hidden="true">‹</span> </a> </li> <c:forEach begin="0" end="${page.totalPage-1}" varStatus="status"> <li> <a href="?page.start=${status.index*page.count}" class="current">${status.count}</a> </li> </c:forEach> <li > <a href="?page.start=${page.start+page.count}" aria-label="Next"> <span aria-hidden="true">›</span> </a> </li> <li > <a href="?page.start=${page.last}" aria-label="Next"> <span aria-hidden="true">»</span> </a> </li> </ul> </nav>
步骤 10 :

完整版的adminPage.jsp

edit
简化的adminPage.jsp用于帮助大家理解,其存在的问题是,即便是没有下一页的数据了,下一页超链也可以点击,点出来的页面是空白的。(首页,上一页,下一页和最后一页都存在这个问题)

那么所谓的完整版的adminPage.jsp,就是对这些边界进行了处理。当没有下一页的时候,对应超链处于不可点击状态。

比如首页:
当page.hasPreviouse为false的时候,为首页连接套用Bootstrap样式 disabled

<li <c:if test="${!page.hasPreviouse}">class="disabled"</c:if>>
<a href="?page.start=0${page.param}" aria-label="Previous" >
<span aria-hidden="true">&laquo;</span>
</a>
</li>

注: hasPreviouse会导致isHasPreviouse()方法被调用,请参考EL表达式获取JavaBean的属性
完整版的adminPage.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false"%> <script> $(function(){ $("ul.pagination li.disabled a").click(function(){ return false; }); }); </script> <nav> <ul class="pagination"> <li <c:if test="${!page.hasPreviouse}">class="disabled"</c:if>> <a href="?page.start=0${page.param}" aria-label="Previous" > <span aria-hidden="true">«</span> </a> </li> <li <c:if test="${!page.hasPreviouse}">class="disabled"</c:if>> <a href="?page.start=${page.start-page.count}${page.param}" aria-label="Previous" > <span aria-hidden="true">‹</span> </a> </li> <c:forEach begin="0" end="${page.totalPage-1}" varStatus="status"> <c:if test="${status.count*page.count-page.start<=20 && status.count*page.count-page.start>=-10}"> <li <c:if test="${status.index*page.count==page.start}">class="disabled"</c:if>> <a href="?page.start=${status.index*page.count}${page.param}" <c:if test="${status.index*page.count==page.start}">class="current"</c:if> >${status.count}</a> </li> </c:if> </c:forEach> <li <c:if test="${!page.hasNext}">class="disabled"</c:if>> <a href="?page.start=${page.start+page.count}${page.param}" aria-label="Next"> <span aria-hidden="true">›</span> </a> </li> <li <c:if test="${!page.hasNext}">class="disabled"</c:if>> <a href="?page.start=${page.last}${page.param}" aria-label="Next"> <span aria-hidden="true">»</span> </a> </li> </ul> </nav>
增值内容,请先登录
完整的SSH模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSH一整套技术栈, 从无到有涵盖全部133个知识点,571个开发步骤, 充实SSH项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢


HOW2J公众号,关注后实时获知最新的教程和优惠活动,谢谢。


问答区域    
2019-12-11 result.intValue();会损失精度吗,不知道咋回事,我看到这里纠结,哈哈~
Ivan2019

Long->int 最近,好多点,都有这种小疑问,是不是多虑了。 别打我,谢谢




1 个答案

how2j
答案时间:2019-12-13
理论上会,但是实际上几乎不会,因为int就20亿了。。。不会有那么多数据的。。



回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
答案 或者 代码至少填写一项, 如果是自己有问题,请重新提问,否则站长有可能看不到




2019-08-29 对不起,站长,是adminPage.jsp上的这一段没理解
qinhao




这段代码我自己分析应该是点击各自的项目以后触发用的,可注释以后不影响程序运行
$(function(){
    $("ul.pagination li.disabled a").click(function(){
        return false;
    });
});

							


1 个答案

how2j
答案时间:2019-08-30
这就表示被 disabled 的超链点击之后没有反应的意思啦



回答已经提交成功,正在审核。 请于 我的回答 处查看回答记录,谢谢
答案 或者 代码至少填写一项, 如果是自己有问题,请重新提问,否则站长有可能看不到





2019-08-29 站长,这段代码有什么用啊?
2019-03-15 看不懂这段代码啊@@@
2018-12-04 分页显示


提问太多,页面渲染太慢,为了加快渲染速度,本页最多只显示几条提问。还有 17 条以前的提问,请 点击查看

提问之前请登陆
提问已经提交成功,正在审核。 请于 我的提问 处查看提问记录,谢谢
关于 实践项目-天猫整站SSH-分页 的提问

尽量提供截图代码异常信息,有助于分析和解决问题。 也可进本站QQ群交流: 635924385
提问尽量提供完整的代码,环境描述,越是有利于问题的重现,您的问题越能更快得到解答。
对教程中代码有疑问,请提供是哪个步骤,哪一行有疑问,这样便于快速定位问题,提高问题得到解答的速度
在已经存在的几千个提问里,有相当大的比例,是因为使用了和站长不同版本的开发环境导致的,比如 jdk, eclpise, idea, mysql,tomcat 等等软件的版本不一致。
请使用和站长一样的版本,可以节约自己大量的学习时间。 站长把教学中用的软件版本整理了,都统一放在了这里, 方便大家下载: https://how2j.cn/k/helloworld/helloworld-version/1718.html

上传截图