jsp電子商務購物車實現之購物車和結算篇

時間 2019-12-05

原文原文鏈接

CartServlet參考代碼 :javascript

public void doPost(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		
		String bookids[] = req.getParameterValues("bookId"); //id數組;
		
		Map<Integer,Book> cart = (Map<Integer,Book>)req.getSession().getAttribute("cart");
		//System.out.println(cart.size()); null對
		/*
		 *     Integer   Book
		 *     id        book  (count)       
		 *     7         book  （count=2）
		 *     8         book  ( count=5)
		 * 
		 * */
		
		BookDao bd = new BookDaoImpl();
		//若是購物車爲null，則new出來一個HashMap對象
		if(cart==null){
			cart = new HashMap<Integer,Book>();//id以及book對象
			req.getSession().setAttribute("cart", cart);
		}
		
		for(String bookid:bookids){
			Book book = cart.get(Integer.parseInt(bookid));
			if(book==null){
				book = bd.findById(Integer.parseInt(bookid));//根據id得到書籍
				book.setCount(1);//數量爲1
			}
			else{
				// 判斷是否已是最後一本書;數量大於得到數量,其餘的不能再加數量了
				if(book.getStock()>book.getCount()){
					book.setCount(book.getCount()+1);
				}
			}
			cart.put(Integer.parseInt(bookid), book);
			//須要放入到數據庫中,那麼購物車表的字段是什麼呢？
			//圖書id 書名  圖片名 數量 合計價格
		}
		
		req.getSession().setAttribute("cart", cart);
		resp.sendRedirect("cart.jsp");
	}

在該Servlet中利用了session進行存放值，就是開篇咱們的方法之一，可是這種方法有什麼問題呢？你們好好思考下！！！

下面是購物車代碼參考：
css

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'cart.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
  <link rel="stylesheet" href="css/style.css" type="text/css"></link>
  
  <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
  
  <script type="text/javascript">
  	function jian(id){
		if($("#count"+id).val()==1){
		//採用淘寶模式，若是低於1，則不用提示，直接不可用;
			$("#count"+id).prev().attribute("disabled","disabled");
			return;
		}
  	
  		$.ajax({
  			url:'ChangeCartCountServlet',
  			type:'post',
  			dataType:'text',
  			data:{
  				bookid:id,
  				count:parseInt($("#count"+id).val())-1   //  -1
  			},
  			success:function(data){
  				
 				var price = $("#price"+id).html();
		  		$("#count"+id).val(parseInt($("#count"+id).val())-1);
		  		$("#sum"+id).val("￥"+price*$("#count"+id).val());
		  		
		  		calcTotal();
  				
  			}
  		});
  	}
  	
  	function add(id){
  		$.ajax({
  			url:'ChangeCartCountServlet',
  			type:'post',
  			dataType:'text',
  			data:{
  				bookid:id,
  				count:parseInt($("#count"+id).val())+1
  			},
  			success:function(data){
  				if(data=="false"){
  					alert("庫存不足!!!!");				
  				}
  				else{
  					var price = $("#price"+id).html();
			  		$("#count"+id).val(parseInt($("#count"+id).val())+1);
			  		$("#sum"+id).val("￥"+price*$("#count"+id).val());
			  		
			  		calcTotal();
  				}
  			}
  		});
  	
  	
  		
  		
  	}
  	
  	function calcTotal(){
  		// input...
  		var counts = $("input[id^=count]").toArray();  
  		var prices = $("div[id^=price]").toArray();
  		var total = 0;
  		
  		for(var i=0;i<prices.length;i++){
  			total += prices[i].innerHTML*counts[i].value;
  		}
  		
  		$("#total").val("￥"+total);
  	}
  
  </script>
  
  </head>
  
  <body>
   <div id="header" class="wrap">
	<div id="banner"></div>
	<div id="navbar">
		<div class="userMenu">
			<ul>
				<li class="current"><font color="BLACK">歡迎您，<strong>andy</strong></font>   </li>
				<li><a href="index.html">首頁</a></li>
				<li><a href="orderlist.html">個人訂單</a></li>
				<li><a href="cart.html">購物車</a></li>
				<li><a href="logout.jsp">註銷</a></li>
			</ul>
		</div>
	</div>
</div>
<div id="content" class="wrap">
	<div class="list bookList">
		<form method="post" name="shoping" action="BuyServlet">
			<table>
				<tr class="title">
					<th class="view">圖片預覽</th>
					<th>書名</th>
					<th class="nums">數量</th>
					<th class="price">價格</th>
					<th class="nums">合計</th>
					<th class="nums">操做</th>
				</tr>
					
					<c:set var="total" value="0"></c:set>
					
					<c:forEach items="${cart}" var="book">	
					<tr>
						
						<td class="thumb">
						<img src="images/book/${book.value.image}" /></td>
						<td class="title">${book.value.bookname}</td>
						<td>
						<img src="images/edit_jian.png" width="12" height="12" 
							onclick="jian(${book.value.id})"/>
							
						<input id="count${book.value.id}" readonly="readonly"
							value="${book.value.count}" size="2"/>
							
						<img src="images/edit_add.png" width="12" height="12" 
						    onclick="add(${book.value.id})"/>
						</td>
						
						<td>￥
							<div id="price${book.value.id}" >${book.value.price}</div>
						</td>
						<td>
							<input id="sum${book.value.id}"
							value='<fmt:formatNumber 
								value="${book.value.count*book.value.price}"
								type="currency"></fmt:formatNumber>'
							/>
							
							
							<c:set var="total" 
								value=
								"${total+book.value.count*book.value.price}"></c:set>
							
							<input type="hidden" name="items" value="10:2:31.6"/>
						</td>
						<td>
						<a href="DeleteCartItemServlet?bookid=${book.value.id}">刪除</a>
						</td>
					</tr>
					</c:forEach>
				
				<tr>
					<td>
						地址
					</td>
					<td colspan="5">
						<input name="shipaddress">
					</td>
				</tr>
				<tr>
					<td>
						電話
					</td>
					<td colspan="5">
						<input name="contactphone">
					</td>
				</tr>	
				<tr><td colspan="5">
				
			<div class="button">
				<h4>總價：
					<input id="total" 
						value='<fmt:formatNumber value="${total}" type="currency"></fmt:formatNumber>'
					/>
				元</h4>
				<input type="hidden" id="hidden_total_price" name="hidden_total_price"/>
				<input class="input-chart" type="submit" name="submit" value="" />
			</div>
			</td></tr>
				
			</table>
		</form>
	</div>
</div>
</body>
	<div id="footer" class="wrap">
		網上書城 &copy; 版權全部
	</div>
</html>
 


</html>

根據id從購物車中刪除的Servlet代碼參考以下：

protected void doGet(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		int bookid = Integer.parseInt(req.getParameter("bookid"));
				
				Map<Integer,Book> cart = (Map<Integer,Book>)
					req.getSession().getAttribute("cart");
				// 根據key(bookid)刪除
				cart.remove(bookid);
				
				req.getSession().setAttribute("cart", cart);
				
				resp.sendRedirect("cart.jsp");
	}