how2j.cn

-->
下载区
文件名 文件大小
请先登录 1m
增值内容 1m
1m

解压rar如果失败,请用5.21版本或者更高版本的winrar

点击下载 winrar5.21
步骤 1 : 先运行,看到效果,再学习   
步骤 2 : 模仿和排错   
步骤 3 : 界面效果   
步骤 4 : ForeController.cart()   
步骤 5 : cart.jsp   
步骤 6 : cartPage.jsp   

步骤 1 :

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

edit
增值内容,请先登录
完整的SSM模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSM一整套技术栈, 从无到有涵盖全部126个知识点,560个开发步骤, 充实SSM项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
增值内容,请先登录
完整的SSM模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSM一整套技术栈, 从无到有涵盖全部126个知识点,560个开发步骤, 充实SSM项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
增值内容,请先登录
完整的SSM模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSM一整套技术栈, 从无到有涵盖全部126个知识点,560个开发步骤, 充实SSM项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
界面效果
步骤 4 :

ForeController.cart()

edit
增值内容,请先登录
完整的SSM模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSM一整套技术栈, 从无到有涵盖全部126个知识点,560个开发步骤, 充实SSM项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
@RequestMapping("forecart") public String cart( Model model,HttpSession session) { User user =(User) session.getAttribute("user"); List<OrderItem> ois = orderItemService.listByUser(user.getId()); model.addAttribute("ois", ois); return "fore/cart"; } }
package com.how2java.tmall.controller; import com.github.pagehelper.PageHelper; import com.how2java.tmall.pojo.*; import com.how2java.tmall.service.*; import comparator.*; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.util.HtmlUtils; import javax.servlet.http.HttpSession; import java.util.ArrayList; import java.util.Collections; import java.util.List; @Controller @RequestMapping("") public class ForeController { @Autowired CategoryService categoryService; @Autowired ProductService productService; @Autowired UserService userService; @Autowired ProductImageService productImageService; @Autowired PropertyValueService propertyValueService; @Autowired OrderService orderService; @Autowired OrderItemService orderItemService; @Autowired ReviewService reviewService; @RequestMapping("forehome") public String home(Model model) { List<Category> cs= categoryService.list(); productService.fill(cs); productService.fillByRow(cs); model.addAttribute("cs", cs); return "fore/home"; } @RequestMapping("foreregister") public String register(Model model,User user) { String name = user.getName(); name = HtmlUtils.htmlEscape(name); user.setName(name); boolean exist = userService.isExist(name); if(exist){ String m ="用户名已经被使用,不能使用"; model.addAttribute("msg", m); return "fore/register"; } userService.add(user); return "redirect:registerSuccessPage"; } @RequestMapping("forelogin") public String login(@RequestParam("name") String name, @RequestParam("password") String password, Model model, HttpSession session) { name = HtmlUtils.htmlEscape(name); User user = userService.get(name,password); if(null==user){ model.addAttribute("msg", "账号密码错误"); return "fore/login"; } session.setAttribute("user", user); return "redirect:forehome"; } @RequestMapping("forelogout") public String logout( HttpSession session) { session.removeAttribute("user"); return "redirect:forehome"; } @RequestMapping("foreproduct") public String product( int pid, Model model) { Product p = productService.get(pid); List<ProductImage> productSingleImages = productImageService.list(p.getId(), ProductImageService.type_single); List<ProductImage> productDetailImages = productImageService.list(p.getId(), ProductImageService.type_detail); p.setProductSingleImages(productSingleImages); p.setProductDetailImages(productDetailImages); List<PropertyValue> pvs = propertyValueService.list(p.getId()); List<Review> reviews = reviewService.list(p.getId()); productService.setSaleAndReviewNumber(p); model.addAttribute("reviews", reviews); model.addAttribute("p", p); model.addAttribute("pvs", pvs); return "fore/product"; } @RequestMapping("forecheckLogin") @ResponseBody public String checkLogin( HttpSession session) { User user =(User) session.getAttribute("user"); if(null!=user) return "success"; return "fail"; } @RequestMapping("foreloginAjax") @ResponseBody public String loginAjax(@RequestParam("name") String name, @RequestParam("password") String password,HttpSession session) { name = HtmlUtils.htmlEscape(name); User user = userService.get(name,password); if(null==user){ return "fail"; } session.setAttribute("user", user); return "success"; } @RequestMapping("forecategory") public String category(int cid,String sort, Model model) { Category c = categoryService.get(cid); productService.fill(c); productService.setSaleAndReviewNumber(c.getProducts()); if(null!=sort){ switch(sort){ case "review": Collections.sort(c.getProducts(),new ProductReviewComparator()); break; case "date" : Collections.sort(c.getProducts(),new ProductDateComparator()); break; case "saleCount" : Collections.sort(c.getProducts(),new ProductSaleCountComparator()); break; case "price": Collections.sort(c.getProducts(),new ProductPriceComparator()); break; case "all": Collections.sort(c.getProducts(),new ProductAllComparator()); break; } } model.addAttribute("c", c); return "fore/category"; } @RequestMapping("foresearch") public String search( String keyword,Model model){ PageHelper.offsetPage(0,20); List<Product> ps= productService.search(keyword); productService.setSaleAndReviewNumber(ps); model.addAttribute("ps",ps); return "fore/searchResult"; } @RequestMapping("forebuyone") public String buyone(int pid, int num, HttpSession session) { Product p = productService.get(pid); int oiid = 0; User user =(User) session.getAttribute("user"); boolean found = false; List<OrderItem> ois = orderItemService.listByUser(user.getId()); for (OrderItem oi : ois) { if(oi.getProduct().getId().intValue()==p.getId().intValue()){ oi.setNumber(oi.getNumber()+num); orderItemService.update(oi); found = true; oiid = oi.getId(); break; } } if(!found){ OrderItem oi = new OrderItem(); oi.setUid(user.getId()); oi.setNumber(num); oi.setPid(pid); orderItemService.add(oi); oiid = oi.getId(); } return "redirect:forebuy?oiid="+oiid; } @RequestMapping("forebuy") public String buy( Model model,String[] oiid,HttpSession session){ List<OrderItem> ois = new ArrayList<>(); float total = 0; for (String strid : oiid) { int id = Integer.parseInt(strid); OrderItem oi= orderItemService.get(id); total +=oi.getProduct().getPromotePrice()*oi.getNumber(); ois.add(oi); } session.setAttribute("ois", ois); model.addAttribute("total", total); return "fore/buy"; } @RequestMapping("foreaddCart") @ResponseBody public String addCart(int pid, int num, Model model,HttpSession session) { Product p = productService.get(pid); User user =(User) session.getAttribute("user"); boolean found = false; List<OrderItem> ois = orderItemService.listByUser(user.getId()); for (OrderItem oi : ois) { if(oi.getProduct().getId().intValue()==p.getId().intValue()){ oi.setNumber(oi.getNumber()+num); orderItemService.update(oi); found = true; break; } } if(!found){ OrderItem oi = new OrderItem(); oi.setUid(user.getId()); oi.setNumber(num); oi.setPid(pid); orderItemService.add(oi); } return "success"; } @RequestMapping("forecart") public String cart( Model model,HttpSession session) { User user =(User) session.getAttribute("user"); List<OrderItem> ois = orderItemService.listByUser(user.getId()); model.addAttribute("ois", ois); return "fore/cart"; } }
增值内容,请先登录
完整的SSM模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSM一整套技术栈, 从无到有涵盖全部126个知识点,560个开发步骤, 充实SSM项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false"%> <%@include file="../include/fore/header.jsp"%> <%@include file="../include/fore/top.jsp"%> <%@include file="../include/fore/simpleSearch.jsp"%> <%@include file="../include/fore/cart/cartPage.jsp"%> <%@include file="../include/fore/footer.jsp"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" isELIgnored="false"%>

<%@include file="../include/fore/header.jsp"%>
<%@include file="../include/fore/top.jsp"%>
<%@include file="../include/fore/simpleSearch.jsp"%>

<%@include file="../include/fore/cart/cartPage.jsp"%>
<%@include file="../include/fore/footer.jsp"%>
增值内容,请先登录
完整的SSM模仿天猫项目,使用J2SE、前端技术(包含所有前端jsp文件)、J2EE,SSM一整套技术栈, 从无到有涵盖全部126个知识点,560个开发步骤, 充实SSM项目经验,为简历加上一个有吸引力的砝码.
增值内容,点击购买
使用爬虫已经被系统记录,请勿使用爬虫,增大封号风险。 如果是误封 ,请联系站长,谢谢
cartPage.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false"%> <script> var deleteOrderItem = false; var deleteOrderItemid = 0; $(function(){ $("a.deleteOrderItem").click(function(){ deleteOrderItem = false; var oiid = $(this).attr("oiid") deleteOrderItemid = oiid; $("#deleteConfirmModal").modal('show'); }); $("button.deleteConfirmButton").click(function(){ deleteOrderItem = true; $("#deleteConfirmModal").modal('hide'); }); $('#deleteConfirmModal').on('hidden.bs.modal', function (e) { if(deleteOrderItem){ var page="foredeleteOrderItem"; $.post( page, {"oiid":deleteOrderItemid}, function(result){ if("success"==result){ $("tr.cartProductItemTR[oiid="+deleteOrderItemid+"]").hide(); } else{ location.href="loginPage"; } } ); } }) $("img.cartProductItemIfSelected").click(function(){ var selectit = $(this).attr("selectit") if("selectit"==selectit){ $(this).attr("src","img/site/cartNotSelected.png"); $(this).attr("selectit","false") $(this).parents("tr.cartProductItemTR").css("background-color","#fff"); } else{ $(this).attr("src","img/site/cartSelected.png"); $(this).attr("selectit","selectit") $(this).parents("tr.cartProductItemTR").css("background-color","#FFF8E1"); } syncSelect(); syncCreateOrderButton(); calcCartSumPriceAndNumber(); }); $("img.selectAllItem").click(function(){ var selectit = $(this).attr("selectit") if("selectit"==selectit){ $("img.selectAllItem").attr("src","img/site/cartNotSelected.png"); $("img.selectAllItem").attr("selectit","false") $(".cartProductItemIfSelected").each(function(){ $(this).attr("src","img/site/cartNotSelected.png"); $(this).attr("selectit","false"); $(this).parents("tr.cartProductItemTR").css("background-color","#fff"); }); } else{ $("img.selectAllItem").attr("src","img/site/cartSelected.png"); $("img.selectAllItem").attr("selectit","selectit") $(".cartProductItemIfSelected").each(function(){ $(this).attr("src","img/site/cartSelected.png"); $(this).attr("selectit","selectit"); $(this).parents("tr.cartProductItemTR").css("background-color","#FFF8E1"); }); } syncCreateOrderButton(); calcCartSumPriceAndNumber(); }); $(".orderItemNumberSetting").keyup(function(){ var pid=$(this).attr("pid"); var stock= $("span.orderItemStock[pid="+pid+"]").text(); var price= $("span.orderItemPromotePrice[pid="+pid+"]").text(); var num= $(".orderItemNumberSetting[pid="+pid+"]").val(); num = parseInt(num); if(isNaN(num)) num= 1; if(num<=0) num = 1; if(num>stock) num = stock; syncPrice(pid,num,price); }); $(".numberPlus").click(function(){ var pid=$(this).attr("pid"); var stock= $("span.orderItemStock[pid="+pid+"]").text(); var price= $("span.orderItemPromotePrice[pid="+pid+"]").text(); var num= $(".orderItemNumberSetting[pid="+pid+"]").val(); num++; if(num>stock) num = stock; syncPrice(pid,num,price); }); $(".numberMinus").click(function(){ var pid=$(this).attr("pid"); var stock= $("span.orderItemStock[pid="+pid+"]").text(); var price= $("span.orderItemPromotePrice[pid="+pid+"]").text(); var num= $(".orderItemNumberSetting[pid="+pid+"]").val(); --num; if(num<=0) num=1; syncPrice(pid,num,price); }); $("button.createOrderButton").click(function(){ var params = ""; $(".cartProductItemIfSelected").each(function(){ if("selectit"==$(this).attr("selectit")){ var oiid = $(this).attr("oiid"); params += "&oiid="+oiid; } }); params = params.substring(1); location.href="forebuy?"+params; }); }) function syncCreateOrderButton(){ var selectAny = false; $(".cartProductItemIfSelected").each(function(){ if("selectit"==$(this).attr("selectit")){ selectAny = true; } }); if(selectAny){ $("button.createOrderButton").css("background-color","#C40000"); $("button.createOrderButton").removeAttr("disabled"); } else{ $("button.createOrderButton").css("background-color","#AAAAAA"); $("button.createOrderButton").attr("disabled","disabled"); } } function syncSelect(){ var selectAll = true; $(".cartProductItemIfSelected").each(function(){ if("false"==$(this).attr("selectit")){ selectAll = false; } }); if(selectAll) $("img.selectAllItem").attr("src","img/site/cartSelected.png"); else $("img.selectAllItem").attr("src","img/site/cartNotSelected.png"); } function calcCartSumPriceAndNumber(){ var sum = 0; var totalNumber = 0; $("img.cartProductItemIfSelected[selectit='selectit']").each(function(){ var oiid = $(this).attr("oiid"); var price =$(".cartProductItemSmallSumPrice[oiid="+oiid+"]").text(); price = price.replace(/,/g, ""); price = price.replace(/¥/g, ""); sum += new Number(price); var num =$(".orderItemNumberSetting[oiid="+oiid+"]").val(); totalNumber += new Number(num); }); $("span.cartSumPrice").html("¥"+formatMoney(sum)); $("span.cartTitlePrice").html("¥"+formatMoney(sum)); $("span.cartSumNumber").html(totalNumber); } function syncPrice(pid,num,price){ $(".orderItemNumberSetting[pid="+pid+"]").val(num); var cartProductItemSmallSumPrice = formatMoney(num*price); $(".cartProductItemSmallSumPrice[pid="+pid+"]").html("¥"+cartProductItemSmallSumPrice); calcCartSumPriceAndNumber(); var page = "forechangeOrderItem"; $.post( page, {"pid":pid,"number":num}, function(result){ if("success"!=result){ location.href="login.jsp"; } } ); } </script> <title>购物车</title> <div class="cartDiv"> <div class="cartTitle pull-right"> <span>已选商品 (不含运费)</span> <span class="cartTitlePrice">¥0.00</span> <button class="createOrderButton" disabled="disabled">结 算</button> </div> <div class="cartProductList"> <table class="cartProductTable"> <thead> <tr> <th class="selectAndImage"> <img selectit="false" class="selectAllItem" src="img/site/cartNotSelected.png"> 全选 </th> <th>商品信息</th> <th>单价</th> <th>数量</th> <th width="120px">金额</th> <th class="operation">操作</th> </tr> </thead> <tbody> <c:forEach items="${ois }" var="oi"> <tr oiid="${oi.id}" class="cartProductItemTR"> <td> <img selectit="false" oiid="${oi.id}" class="cartProductItemIfSelected" src="img/site/cartNotSelected.png"> <a style="display:none" href="#nowhere"><img src="img/site/cartSelected.png"></a> <img class="cartProductImg" src="img/productSingle_middle/${oi.product.firstProductImage.id}.jpg"> </td> <td> <div class="cartProductLinkOutDiv"> <a href="foreproduct?pid=${oi.product.id}" class="cartProductLink">${oi.product.name}</a> <div class="cartProductLinkInnerDiv"> <img src="img/site/creditcard.png" title="支持信用卡支付"> <img src="img/site/7day.png" title="消费者保障服务,承诺7天退货"> <img src="img/site/promise.png" title="消费者保障服务,承诺如实描述"> </div> </div> </td> <td> <span class="cartProductItemOringalPrice">¥${oi.product.originalPrice}</span> <span class="cartProductItemPromotionPrice">¥${oi.product.promotePrice}</span> </td> <td> <div class="cartProductChangeNumberDiv"> <span class="hidden orderItemStock " pid="${oi.product.id}">${oi.product.stock}</span> <span class="hidden orderItemPromotePrice " pid="${oi.product.id}">${oi.product.promotePrice}</span> <a pid="${oi.product.id}" class="numberMinus" href="#nowhere">-</a> <input pid="${oi.product.id}" oiid="${oi.id}" class="orderItemNumberSetting" autocomplete="off" value="${oi.number}"> <a stock="${oi.product.stock}" pid="${oi.product.id}" class="numberPlus" href="#nowhere">+</a> </div> </td> <td > <span class="cartProductItemSmallSumPrice" oiid="${oi.id}" pid="${oi.product.id}" > ¥<fmt:formatNumber type="number" value="${oi.product.promotePrice*oi.number}" minFractionDigits="2"/> </span> </td> <td> <a class="deleteOrderItem" oiid="${oi.id}" href="#nowhere">删除</a> </td> </tr> </c:forEach> </tbody> </table> </div> <div class="cartFoot"> <img selectit="false" class="selectAllItem" src="img/site/cartNotSelected.png"> <span>全选</span> <!-- <a href="#">删除</a> --> <div class="pull-right"> <span>已选商品 <span class="cartSumNumber" >0</span> 件</span> <span>合计 (不含运费): </span> <span class="cartSumPrice" >¥0.00</span> <button class="createOrderButton" disabled="disabled" >结 算</button> </div> </div> </div>


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


问答区域    
2021-07-30 站长我发现一个bug:仅仅点立即购买 然后到结算页面 什么都不干直接退出,orderItem依然会增加一条 这会影响到购物车流程
vcaml

场景如下: 仅仅点立即购买 然后到结算页面 什么都不干直接退出。(突然不想买了) 这时候我再回到同样的产品页面 选择 1 件 加入购物车 这时候跳转到购物车页面的时候 购物车里会有2件。 这个算bug吧????




1 个答案

how2j
答案时间:2021-08-21
因为点击购买就已经进入购物车了呀,这是正常的现象哦



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




2020-06-01 关于Ajax的post请求与get请求
凝视前方身后的距离




站长你好,请问这里为什么用的 post的Ajax请求,前面很多地方用的是get请求?
if(deleteOrderItem){
            var page="foredeleteOrderItem";
            $.post(
                    page,
                    {"oiid":deleteOrderItemid},
                    function(result){
                        if("success"==result){
                            $("tr.cartProductItemTR[oiid="+deleteOrderItemid+"]").hide();
                        }
                        else{
                            location.href="loginPage";
                        }
                    }
                );
             
        }

							


1 个答案

how2j
答案时间:2020-06-02
嗯?没区别吧,用get 和 post 都可以使用的



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





2020-04-19 这是什么选择器 $(".orderItemNumberSetting[pid="+pid+"]").val(num);
2020-03-13 站长我有个小问题
2019-12-17 查看购物车页面,修改每个商品的数量,点击结算按钮,每个商品的最终数量是怎么传回去的?


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

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

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

上传截图