JSP实现点击按钮添加商品到ArrayList并在cart.jsp展示

你现有代码存在4个核心问题，直接按下面的步骤改就能跑通：

• 按钮value直接输出<%=product%>会调用Product类的toString()方法，提交后拿到的是字符串，无法还原为商品对象
• 加购表单没有配置提交路径和请求方法，点击按钮不会触发后端处理逻辑
• productList、cartList直接初始化为null，遍历会直接抛空指针异常；且购物车集合没有存入会话域，不同请求间加购数据会丢失
• 没有编写加购请求的处理逻辑，无法把用户选中的商品存入购物车集合

1. 修正index.jsp代码 #

首先在页面顶部导入需要的类，注意把Product的包路径替换成你项目里的实际路径。
加购逻辑直接在index.jsp里处理即可，表单提交时只传商品唯一ID，处理完成后重定向到cart.jsp避免重复提交。

<%@ page import="java.util.ArrayList" %>
<%@ page import="com.yourpackage.entity.Product" %> <!-- 替换成你自己的Product类全路径 -->
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    // 1. 初始化商品列表，这里替换成你实际查询商品的逻辑，不要留null
    ArrayList<Product> productList = new ArrayList<>();
    // 示例：往productList里塞测试商品，你自己替换成业务数据
    // productList.add(new Product(1, "商品A", 9.9, "食品类"));
    // productList.add(new Product(2, "商品B", 19.9, "日用品类"));

    // 2. 处理加购POST请求
    if ("POST".equalsIgnoreCase(request.getMethod())) {
        // 获取提交的商品ID
        int productId = Integer.parseInt(request.getParameter("productId"));
        // 从商品列表里找到对应商品
        Product targetProduct = null;
        for (Product p : productList) {
            if (p.getId() == productId) {
                targetProduct = p;
                break;
            }
        }
        // 从session取购物车，不存在就初始化
        ArrayList<Product> cartList = (ArrayList<Product>) session.getAttribute("cartList");
        if (cartList == null) {
            cartList = new ArrayList<>();
            session.setAttribute("cartList", cartList);
        }
        // 商品存在就加入购物车
        if (targetProduct != null) {
            // 如果需要做同商品数量累加，在这里先判断cartList里有没有同id商品，有就改count，没有再加新对象
            cartList.add(targetProduct);
        }
        // 处理完重定向到购物车页面，避免表单重复提交
        response.sendRedirect("cart.jsp");
        return;
    }
%>
<!-- 商品列表展示部分 -->
<% for (Product product : productList) { %>
<div class="menu-item">
    <div class="product-info">
        <h3><%=product.getName() %></h3>
        <p class="price"><%=product.getPrice() %></p>
        <p class="category"><%=product.getCategory() %></p>
    </div>
    <form class="add-to-cart" method="post" action="index.jsp">
        <!-- 隐藏域传商品ID，不要把整个对象塞value里 -->
        <input type="hidden" name="productId" value="<%=product.getId()%>">
        <button type="submit">Add</button>
    </form>
</div>
<% } %>

2. 编写cart.jsp购物车展示页 #

和index.jsp放在同一目录下，直接从session里取出购物车集合遍历展示即可，逻辑和商品列表一致。

<%@ page import="java.util.ArrayList" %>
<%@ page import="com.yourpackage.entity.Product" %> <!-- 和index.jsp的导包保持一致 -->
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    ArrayList<Product> cartList = (ArrayList<Product>) session.getAttribute("cartList");
%>
<h2>我的购物车</h2>
<% if (cartList == null || cartList.isEmpty()) { %>
<p>购物车暂无商品</p>
<% } else { %>
    <% for (Product product : cartList) { %>
    <div class="cart-item">
        <h3><%=product.getName() %></h3>
        <p class="price"><%=product.getPrice() %></p>
        <p class="category"><%=product.getCategory() %></p>
    </div>
    <% } %>
<% } %>
<a href="index.jsp">返回商品列表</a>

注意事项 #

• Product类必须实现Serializable接口，否则存入session时部分Servlet容器会抛出序列化异常
• 每个商品必须有全局唯一的id属性作为匹配依据，不要直接在前端传整个商品对象
• 如果需要实现购物车商品数量统计，给Product类新增count属性即可，加购时如果购物车已存在同id商品，直接把对应商品的count+1，不要重复add对象
• 正式项目不建议在JSP里写业务逻辑，这里是为了适配你现有脚本写法做最小改动，后续可以把加购逻辑抽到Servlet里实现

内容的提问来源于stack exchange，提问作者Peloucvo