添加商品至购物车时始终获取最后一个商品ID的问题求助

问题现象 #

在将商品添加到购物车时，无论点击哪个商品的按钮，始终获取到最后一个商品卡片的product_id，无法正确获取对应商品的ID。

问题根源 #

1. 表单未独立闭合：每个商品卡片的<form>标签未正确闭合，导致所有商品的表单元素（包括隐藏的product_id）都被合并到同一个表单中，提交时只会读取最后一个product_id的值。
2. 购物车按钮未配置提交属性：购物车图标按钮缺少type="submit"和name属性，无法触发表单提交；当前只有爱心按钮（add_this）能触发提交，但这是心愿单操作，和购物车功能混淆。
3. HTML语法错误：生成的HTML存在多处语法问题（如链接中的多余?>、标签未闭合、注释格式错误），导致DOM结构混乱，影响表单正常解析。

修复方案 #

1. 修复商品卡片生成函数

修正HTML语法错误，确保每个商品的表单独立闭合，并为购物车按钮添加正确的提交属性：

<?php
function productlist($price, $product_name, $picture, $size, $productid)
{
    // 修正HTML语法错误，确保表单独立闭合，按钮属性正确
    $element = "\n        <div class=\"col-lg-3 col-md-6\" data-aos=\"fade-up\" data-aos-offset=\"200\" data-aos-delay=\"50\" data-aos-duration=\"1000\">  
        <div class=\"card card-border card-border cards-float card-hov card-height\" style=\"width: 18rem;\">
        <form method=\"post\" enctype=\"multipart/form-data\">
        <div class=\"inner\">
        <div class=\"view\">
                <a class=\"text-decoration-none\" href=\"product/large/$picture\">         
                <img class=\"card-img-top img-card \" src=\"product/large/$picture\"></a>
        </div>
     </div>
<!-- add to cart button and wishlist button start from here -->
            <div class=\"sidenav\">                                                               
            <button type=\"submit\" name=\"add_to_wishlist\" class=\"wishlist-btn\"><i class=\"fa fa-heart-o align-baseline\" style=\"font-size:20px;\"></i> </button> 
            <input type=\"hidden\" name=\"product_id\" value='$productid'>                                    
            <button type=\"submit\" name=\"add_to_cart\" class=\"cart-btn\"><i class=\"fa fa-shopping-cart\" style=\"font-size:20px\"></i></button> 
            </div>
<!-- add to cart button and wishlist button stop from here -->

            <div class=\"card-body\">
                <p class=\"card-text text-secondary\">$product_name  | $size |</p>
                <p class=\"card-text text-secondary\"></p>
                <h5>
                    <small><s class=\"text-secondary\"></s></small>
                    <span class=\"price\" style=\"text-decoration:none;\">$$price</span>
                </h5>
                <a href=\"checkout_page_1.php\" class=\"btn btn-light text-light card-btn\">Buy Now</a>
                </div>
            </div>
        </form> <!-- 闭合当前商品的表单 -->
     </div>
";
    echo $element;
}
?>

2. 优化会话处理代码

区分购物车和心愿单操作，同时修复购物车添加逻辑（避免覆盖已有商品）：

<?php
session_start(); // 确保会话已启动

// 处理添加购物车请求
if (isset($_POST['add_to_cart'])) {
    $product_id = $_POST['product_id'];
    if (isset($_SESSION['cart'])) {
        // 检查商品是否已在购物车中，避免重复添加（可选）
        $exists = false;
        foreach ($_SESSION['cart'] as $item) {
            if ($item['product_id'] == $product_id) {
                $exists = true;
                break;
            }
        }
        if (!$exists) {
            $_SESSION['cart'][] = ['product_id' => $product_id];
        }
    } else {
        $_SESSION['cart'] = [['product_id' => $product_id]];
    }
    print_r($_SESSION['cart']);
}

// 处理添加心愿单请求（可选）
if (isset($_POST['add_to_wishlist'])) {
    $product_id = $_POST['product_id'];
    // 类似购物车的逻辑处理心愿单
    if (!isset($_SESSION['wishlist'])) {
        $_SESSION['wishlist'] = [];
    }
    $_SESSION['wishlist'][] = ['product_id' => $product_id];
    print_r($_SESSION['wishlist']);
}
?>

3. 保留原调用逻辑不变

index页面的卡片调用代码无需修改，确保每个商品生成独立的表单即可：

<?php 
$result = $database->getData();

while ($row = mysqli_fetch_assoc($result)){
    productlist($row['price'], $row['product_name'], $row['picture'], $row['size'], $row['pro_id']);
}
?>

关键修复点说明 #

• 每个商品的表单通过</form>标签独立闭合，确保每个表单只包含当前商品的product_id隐藏字段。
• 为购物车按钮添加type="submit"和name="add_to_cart"属性，与心愿单按钮的name="add_to_wishlist"区分，实现不同操作的分别处理。
• 修正了HTML中的语法错误（如链接、图片标签的多余?>，注释格式错误），保证DOM结构正确。
• 优化购物车会话逻辑，避免覆盖已有商品，可选择添加重复商品检查。

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