java基础 - 购物车批量删除、全选和合计

小伙伴们,你们好呀,我是老寇

目录

一、功能简介

二、核心代码

一、功能简介

1.批量删除:获取要删除商品的id,在servlet进行判断并删除

2.全选:通过你点击这个节点找自己的父节点或兄弟节点

二、核心代码

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>网上书城购物车</title>

<script src="${pageContext.request.contextPath }/client/js/jquery-3.3.1.min.js"></script>
	</head>
	<body>
<script type="text/javascript">

function jia(count,total,id,file){
	count = parseInt(count);
	total = parseInt(total);
	if(count==total+1){
		alert("已达到图书最大购买量");
		count=total;
	}else if(count>100){
		return;
	}
		location.href=file+"/removeBookServlet?book_id="+id+"&count="+count;
} 

function remove(id,file){
	var mes="确认删除图书?";
	 var remove=confirm(mes);
	if(remove){
		location.href=file+"/removeBookServlet?book_id="+id+"&count=0";
	}
} 

function jian(count,total,id,file){	
	count = parseInt(count);
	total = parseInt(total);
	if(count==0){
		var flag=window.confirm("确认删除图书?");
		if(flag){
    		location.href=file+"/removeBookServlet?book_id="+id+"&count=0";
			return;
		}else{
	        count=1;
		}
	}
	location.href=file+"/removeBookServlet?book_id="+id+"&count="+count;
}

</script>
<script type="text/javascript">
$(function(){
	
$('#j_removeproducts').click(function(){
	var arr=new Array();
	var count=0;
	var flag=window.confirm("确定删除?");
	if(flag){
	$('[name=items]:checkbox').each(function(){
	    if($(this).prop('checked')){
	    	arr[count++]=$(this).siblings('.myid2').val();
	    }
	});
 	location.href="/OnlineBookStore/batchDeleteServlet?id="+arr;
	}
});
	
    $("#AllChecked").click(function(){
   	var sum=0;
   	var num=0;
    	$('#AllCheck').prop('checked',this.checked);
   	$('[name=items]:checkbox').prop('checked',this.checked);
   	 $('[name=items]:checkbox').each(function(){
   		 if($(this).prop('checked')){
 			$('#checkout_btn').attr({"style":"background-color: #ff2832;cursor: pointer;"});
    	    num+=parseInt($(this).siblings('input').val());
       		sum+=parseInt($(this).val());
   		}else{
			$('#checkout_btn').removeAttr('style');
   		}
   	});
   	    $('#total').text("¥"+sum+".00");
		$('#payAmount').text("¥"+sum+".00");
		$('font').text(num);
   });
    
    $("#AllCheck").click(function(){
    	var sum=0;
    	var num=0;
    	$('#AllChecked').prop('checked',this.checked);
    	$('[name=items]:checkbox').prop('checked',this.checked);
    	 $('[name=items]:checkbox').each(function(){
    		if($(this).prop('checked')){
     			$('#checkout_btn').attr({"style":"background-color: #ff2832;cursor: pointer;"});
   	    	    num+=parseInt($(this).siblings('input').val());
        		sum+=parseInt($(this).val());
    		}else{
    			$('#checkout_btn').removeAttr('style');
    		}
    	});
    	 $('#total').text("¥"+sum+".00");
 		$('#payAmount').text("¥"+sum+".00");
		 $('font').text(num);
    });
   
$('[name=items]:checkbox').click(function(){
   	$('[name=items]:checkbox').each(function(){    		
   		if(!$(this).prop('checked')){
   	    	$('#AllChecked').prop('checked',false);
   	    	$('#AllCheck').prop('checked',false);
   		}
   	});
   });
$('[name=items]:checkbox').click(function(){
	var sum=0;
	var num=0;
	$('[name=items]:checkbox').each(function(){
	    if($(this).prop('checked')){
	    	num+=parseInt($(this).siblings('input').val());
	    	sum+=parseInt($(this).val());
	    	$('#total').text("¥"+sum+".00");
	    	$('#payAmount').text("¥"+sum+".00");
	    	$('font').text(num);
 			$('#checkout_btn').attr({"style":"background-color: #ff2832;cursor: pointer;"});
	    }else{
	    	$('#total').text("¥"+sum+".00");
	    	$('#payAmount').text("¥"+sum+".00");
	    	$('font').text(num);
	    }
	});
	if(num==0){
		$('#checkout_btn').removeAttr('style');
	}
});
$('#checkout_btn').click(function(){
	var num=parseInt($('font').text());
	var arr=new Array();
	var date=new Array();
	var count=0;
	if(num>0){
		$('[name=items]:checkbox').each(function(){
		    if($(this).prop('checked')){
		    	arr[count++]=$(this).siblings('.myid').val();
		    }	
		});
    location.href="/OnlineBookStore/settlementServlet?id="+arr+"&date="+date;	
	}
});
}); 

</script>
	<div>
<jsp:include page="head.jsp"/>
<jsp:include page="search.jsp"/>
<div class="navg"><img src="${pageContext.request.contextPath }/client/images/book.jpg" alt="" height="100px" width="250px"></div>
</div>
<div class="logo_line">
    <div class="w960">
        <div class="shopping_procedure"><span class="current">我的购物车</span><span>填写订单</span><span>完成订单</span></div>
    </div>
</div>
<c:choose>
<c:when test="${sessionScope.user==null }">
<div id="LoginFalse" class="login_tip">
			<span class="icon"></span>
			您还没有登录!登录后购物车的商品将保存到您的帐号中
			<a href="${pageContext.request.contextPath }/client/login.jsp?action=1" class="btn">立即登录</a>
</div>
</c:when>
<c:otherwise>
<div id="LoginFalse" class="login_tip">
			<span class="icon"></span>
			亲,您已登录,赶快去购物吧!
</div>
</c:otherwise>
</c:choose>

		<div class="w960" id="cart">
		<ul class="shopping_title" id="j_carttitle">
        <li class="f1"><input type="checkbox" id="AllChecked"/>&nbsp;<label for="AllChecked">全选</label></li>
        <li class="f2">序号</li>
        <li class="f3">图书名称</li>
        <li class="f4">单价(元)</li>
        <li class="f5">数量</li>
        <li class="f6">金额(元)</li>
        <li class="f7">操作</li>
        </ul>
       <div class="fn-shops" id="J_cartContent">
       	<div class="fn-shop" data-shopids="0">
       		<table width="100%" cellspacing="0" cellpadding="0" border="0">       			
       			<c:forEach items="${sessionScope.cart}"  var="entry" varStatus="vs">
       			<tr>
       				<td style="width: 150px;padding-left: 63px;"><input type="checkbox" name="items" value="${entry.key.price*entry.value}" style="margin-top: 3px;"/>
       				<input type="hidden" value="${entry.value }"/>
       				<input type="hidden" class="myid2" value="${entry.key.book_id}"/>
       				<input type="hidden" class="myid" value="${entry.key.book_id}"/>
       				</td>
       				<td style="width: 150px;float: left;margin-left: 5px;">${vs.count }</td>
       				<td style="width: 150px;float: left;margin-left: -25px;"><a class="book_name">${entry.key.book_name}</a></td>
       				<td style="width: 150px;float: left;margin-left: 1px;">¥${entry.key.price }0</td>
       				<td style="width: 150px;float: left;margin-left: -5px;">
       				<img onclick="jian('${entry.value-1}','${sessionScope.num }','${entry.key.book_id }','${pageContext.request.contextPath }')" alt="-" src="${pageContext.request.contextPath }/client/images/jians.jpg" style="margin-top: 3px;cursor: pointer;">
       				<input type="text" class="num"  value="${entry.value }" readonly="readonly"/>	    
                    <img onclick="jia('${entry.value+1}','${sessionScope.num }','${entry.key.book_id }','${pageContext.request.contextPath }')" alt="+" src="${pageContext.request.contextPath }/client/images/jias.jpg" style="margin-left: -2px;margin-top: 3px;cursor: pointer;">
       				</td>
       				<td style="width: 150px;float: left;margin-left: 6px;"><span style=" color:#ff2832;">¥${entry.key.price*entry.value}0</span></td>
       				<td style="width: 70px;float: left;margin-left: 18px;"><a class="cao" href="javascript:void(0);" onclick="remove('${entry.key.book_id }','${pageContext.request.contextPath }')">删除</a></td>
       			</tr>
       		</c:forEach>
       		<tr class="total"> 
       		<td><div class="row_img">店铺合计</div></td>
       		<td class="row4"><span class="red big ooline alignright" id="total" style="color:#ff2832;font-size:16px;margin-left: 579px">¥0</span></td> 
       		</tr>
       		</table>
       		</div>
           </div>
           <div class="shop_total">
           <div class="shopping_total_right">
        <a class="total_btn fn-checkout unable" href="javascript:void(0);" id="checkout_btn" title="结算">结&nbsp;&nbsp;算</a>
        <div class="subtotal">
            <p><span class="cartsum">总计(不含运费):</span><span id="payAmount" class="price">¥0</span></p>
            <p><span class="cartsum">已节省:</span><span id="totalFavor">¥0.00</span></p>
        </div>
    </div>
    <div class="shopping_total_left" id="J_leftBar">
    <input type="checkbox" id="AllCheck"/>&nbsp;<label for="AllChecked">全选</label>
        <a id="j_removeproducts" href="javascript:void(0);" class="fn-batch-remove" title="批量删除按钮">批量删除</a>
        <span>已选择<font color="red">0</font>件商品</span>
    </div>
           </div>
       </div>
</body>
</html>
package cn.bookstore.servlet;

import java.io.IOException;
import java.util.Iterator;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import cn.bookstore.domain.Book;

/**
 * 批量删除
 */
@WebServlet("/batchDeleteServlet")
public class batchDeleteServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String id=request.getParameter("id");
        String[] myid=id.split(",");   
		Map<Book,Integer> cart=(Map<Book, Integer>) request.getSession().getAttribute("cart");
/**
 * Map的实现不是同步的。如果程序中出现多个线程同时访问一个Map,而其中至少一个线程修改Map时,
它必须保持外部同步。而通过查看Iterator原理发现,Iterator是工作在一个独立的线程中,并且拥有一个 mutex锁,
就是说Iterator在工作的时候,是不允许被迭代的对象被改变的,所以调用Iterator操作获得的对象在多线程修改Map的时候会自动失效。
 */
		Iterator<Book> it = cart.keySet().iterator();
		if(cart.size()==myid.length){
			cart.clear();
		}else{
			while(it.hasNext()) {
				Book book=it.next();
	    	   for(String bookid:myid){
	    		if(bookid.equals(book.getBook_id())){
	    			System.out.println("移出书籍:"+book.getBook_name());
                     it.remove();
	    		}
	    	}
		    }
		}
		   request.getRequestDispatcher("/client/shoppingcart.jsp").forward(request, response);
			return;
	}

}

效果图

批量删除

如果能解决您的问题,将不胜荣幸!!!

评论 12
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值