为什么我的桌子这样表现？

Question

我有一个表格，代表客户的购物车中有“从购物车中删除”按钮的所有产品。它使用户能够移除购物车中的某个产品。以下是代码：

<form 
     action="${pageContext.request.contextPath}/customer/removeProduct" 
     method="post"> 
     <input type="hidden" name="page" value="${page}"> 
     <table class="table"> 
      <thead> 
       <tr> 
        <th>Name</th> 
        <th>Quantity</th> 
        <th>Amount</th> 
       </tr> 
      </thead> 
      <tbody> 
       <c:forEach items="${productsInCart}" var="product" 
        varStatus="status"> 
        <input type="hidden" class="form-control" name="upc" 
          value="${product.getProduct().getUpc()}"> 
        <tr class="warning"> 

         <td>${product.getProduct().getName()}</td> 
         <td>${product.getQuantity()}</td> 
         <td style="color: green;">&#8369; ${product.totalPrice()}</td> 
         <td><input type="submit" class="btn btn-warning btn-xs" 
          value="Remove from cart"></td> 
        </tr> 
       </c:forEach> 
      </tbody> 
     </table> 
    </form> 

通过在控制器中发送其UPC（通用产品代码）来删除产品。但是，当点击“从购物车中移除”按钮时，购物车中所有产品的UPC都会被发送。我不知道为什么会发生这种情况。

Answer 1

基于对我的评论的假设，你可以这样做：

<table class="table"> 
    <thead> 
     <tr> 
      <th>Name</th> 
      <th>Quantity</th> 
      <th>Amount</th> 
     </tr> 
    </thead> 
    <tbody> 
     <c:forEach items="${productsInCart}" var="product" 
      varStatus="status"> 
      <form action="${pageContext.request.contextPath}/customer/removeProduct" method="post"> 
       <input type="hidden" name="page" value="${page}"> 
       <input type="hidden" class="form-control" name="upc" 
         value="${product.getProduct().getUpc()}"> 
       <tr class="warning"> 

        <td>${product.getProduct().getName()}</td> 
        <td>${product.getQuantity()}</td> 
        <td style="color: green;">&#8369; ${product.totalPrice()}</td> 
        <td><input type="submit" class="btn btn-warning btn-xs" 
         value="Remove from cart"></td> 
       </tr> 
      </form> 
     </c:forEach> 
    </tbody> 
</table>