如何使用javascript或ajax在php中更新购物车中的每个项目

我有一个带有加减按钮的购物车页面来更新数量。我已经使用jquery实现了加减按钮的功能。现在的问题是它只对第一项有效。它不适用于其他项目

<div class="row1 clearfix"> 
    <?php $sql="select * from `add_cart` where user_id='$u_id'";
        $i=0;
        $query=mysqli_query($conn,$sql);
        //$row=mysqli_fetch_assoc($query);
        while($row=mysqli_fetch_assoc($query))
        {
        $b_id=$row['book_id'];
        $i++;
    ?>  
    <div id="cart_form">
        <form  method="post" action="move_wish_list.php?action=add&id=<?php echo $b_id; ?>" >
    <div class="span4">
       <table width="100%" border="0" cellpadding="0">
          <!-- this will store the value in name and we can use it to store the variable to wish list-->
          <input type="hidden" name="u_id" id="uid_<?php echo $i;?>" value="<?php echo $row['user_id'];?>"/>
           <input type="hidden" name="u_name" id="fname_<?php echo $i;?>" value="<?php echo $row['user_name'];?>"/>
           <input type="hidden" name="bookid" id="bookid_<?php echo $i;?>" value="<?php echo $row['book_id'];?>"/>
           <input type="hidden" name="nm" id="nm_<?php echo $i;?>" value="<?php echo $row['book_name'];?>"/>
           <input type="hidden" name="edtn" id="edtn_<?php echo $i;?>" value="<?php echo $row['book_edition'];?>"/>
           <input type="hidden" name="ofr" id="ofr_<?php echo $i;?>" value="<?php echo $row['book_offer'];?>"/>
           <input type="hidden" name="qty" id="qty_<?php echo $i;?>" value="<?php echo $row['book_quantity'];?>"/>
           <input type="hidden" name="bimg" id="bimg_<?php echo $i;?>" value="<?php echo $row['book_image'];?>"/>
           <input type="hidden" name="rat" id="rat_<?php echo $i;?>" value="<?php echo $row['book_rating'];?>"/>
           <input type="hidden" name="price" id="price_<?php echo $i;?>" value="<?php echo $row['book_price'];?>"/>
           <input type="hidden" name="mode" id="mode_<?php echo $i;?>" value="<?php echo $row['book_delivery_mode'];?>"/>
           <input type="hidden" name="avl" id="avl_<?php echo $i;?>" value="<?php echo $row['book_availability'];?>"/>
           <input type="hidden" name="pin" id="pin_<?php echo $i;?>" value="<?php echo $row['delivery_pin'];?>"/>
             <tbody>
            <tr>
            <td width="46%" height="40" align="center"><strong>ITEM</strong></td>
             </tr>
             <tr>
            <td><img src="control/Book_Images/<?php echo $row['book_image']; ?>" width="100" height="100"/></td>
           <td width="54%" align="left" valign="middle"><?php echo $row['book_name']; ?></td>
                </tr>
               </tbody>
            </table>

          </div>
          <div class="span2">
            <table width="100%" border="0" cellpadding="0">
              <tbody>
            <tr>
                  <td width="49%" height="40"><strong>QTY</strong></td>
                  <input type="hidden" name="u_id" id="uid_<?php echo $i;?>" value="<?php echo $row['user_id'];?>"/>

                </tr>
              <td width="51%" height="40"><strong>


                <br>
                <input type="submit" name="save" value="-" id="minus_<?php echo $i;?>">
                <input name="qty" type="text" value="<?php echo $row['book_quantity'];?>" style="width:30%;" id="number_<?php echo $i;?>">
                <input type="hidden" name="bookid" id="bookid_<?php echo $i;?>" value="<?php echo $row['book_id'];?>"/>
                <input type="submit"  name="save" value="+" id="plus_<?php echo $i;?>">

                  <!--p><button type="submit" name="save" id="save"> save</button></p-->
                  <p><?php echo $row['book_availability']; ?></p>



                  <img src="images/rating-img.png"/>

                  </strong></td>

                  </tbody>
            </table>
          </div>
          <div class="span2">
            <table width="100%" border="0" cellpadding="0">
              <tbody>
                <tr>
                  <td width="49%" height="40"><strong>PRICE</strong></td>
                  <td width="49%" height="40"><strong>Edition</strong></td>

                  </tr>
                <tr>
              <td width="51%" height="40"><?php echo $row['book_price'];?>

            <input type="hidden" name="book_price" value="<?php echo  @$b_price.=$row['book_price'].",   ";?> " />
              </td>
              <br>
           <td width="51%" height="40"><?php echo $row['book_edition']; ?>
        <input type="hidden" name="book_edition" value="<?php echo @$b_edition.=$row['book_edition'].",   ";?>" />

             <br>

                  </td> </tr><td width="49%" height="40"><strong>Delivery Pin :</strong></td>
                  <td width="49%" height="40">
                    <input type="hidden" name="pincode"value="<?php echo $row['delivery_pin']; ?>" />
                  <strong><?php echo $row['delivery_pin']; ?></strong></td>
                  </tbody>
            </table>
          </div>
          <div class="span2">
            <table width="100%" border="0" cellpadding="0">
              <tbody>               
                <tr>
                  <td width="49%" height="40"><strong>DELIVERY DETAILS</strong></td>
                </tr>
                <tr>
              <td width="51%" height="40"><strong>Rs. 40</strong>
              <input type="hidden" name="del_mode" 
              value="<?php echo @$book_delivery_mode.=$row['book_delivery_mode'].";  "; ?>"/>

                <p><?php echo $row['book_delivery_mode']; ?></p>
                <p>Delivery in 2 days, Fri</p></td>
                </tr>
                  </tbody>
            </table>
          </div>
          <div class="span2">
            <table width="100%" border="0" cellpadding="0">
              <tbody>
                <tr>
                  <td width="49%" height="40"><strong>SUBTOTAL</strong></td>
                </tr>
                <tr>
              <td width="51%"  height="40">
              <?php echo $subtotal=$row['book_price'] * $row['book_quantity']; 

              ?>
              </td>
        </tr>
       </tbody>
    </table>
          </div>
          <div class="span12">
         <table width="100%" border="0" cellpadding="0">
  <tbody>
  <tr>
       <td width="25%" align="center">
        <button type="submit"   style="color:#f9f9f9;" name="add" class="btn 
    btn-success" >Move To Wishlist </button> 


       <!--<a href="#">Move To Wishlis</a>-->

     <a class="btn btn-danger" href="del_cart_item.php?delete_id=<?php echo $b_id;?>" title="click for delete" onclick="return confirm('sure to delete cart item ?')"><span class="glyphicon glyphicon-remove-circle"></span> Remove</a></td>

     </tr>  
    </tbody>
  </table>          
          </div> 
          </form>
          </div>
           <?php }?>

"/>





价格
版本

交付详细信息
Rs.40

两天内交货，星期五

小计
移动到愿望列表

javascript更新数量编号

<script type="text/javascript">
var id_help_arr = this.id.split('_');
var input = document.getElementById("number_"+id_help_arr[1]);

function minus() {
  var num = +input.value; //+ for convert from string to number
  num--;
  input.value = num;
}

function plus() {
  var num = +input.value; //+ for convert from string to number
  num++;
  input.value = num;
}

document.getElementById("minus"+id_help_arr[1]).onclick = minus;
document.getElementById("plus"+id_help_arr[1]).onclick = plus;
</script>

var id_help_arr=此.id.split（“”）；
var input=document.getElementById（“数字”+id\u帮助\u arr[1]）；
函数负（）{
var num=+input.value；//+表示从字符串到数字的转换
num--；
input.value=num；
}
函数plus（）{
var num=+input.value；//+表示从字符串到数字的转换
num++；
input.value=num；
}
document.getElementById（“减号”+id\u help\u arr[1]）。onclick=减号；
document.getElementById（“plus”+id\u help\u arr[1]）。onclick=plus；

现在是move_wish_list.php的代码

<?php
include('control/db.php');
session_start();

$idd=$_SESSION['user_id'];
$bkid=$_GET['id'];
if(isset($_POST['save']))
{
$a=$_POST['qty'];
$b=mysqli_query($conn,"UPDATE add_cart set book_quantity='$a' where 
book_id='$bkid' AND user_id='$idd' ");
header('location:cart.php');
}else{
$u_id = $_POST['u_id'];
$u_name = $_POST['u_name'];
$bid=$_POST['bookid'];
$img=$_POST['bimg'];
$name=$_POST['nm'];
$rat=$_POST['rat'];
$price=$_POST['price'];
$edi=$_POST['edtn'];
$offer=$_POST['ofr'];
$pincode = array('110011','110056','110045','110034');
if(!empty($_POST['pin'])){
if(in_array($_POST['pin'],$pincode)){
$pin=$_POST['pin'];
}else{
@$err="Invalid Pin Code";
return false;
}
}

$mode=$_POST['mode'];
$avl=$_POST['avl'];
if(!empty($_POST['qty'])){
$qty=$_POST['qty'];
}
$sql1="SELECT * FROM `add_wishlist` WHERE `book_id`='$bkid' AND ` 
user_id`='$idd'" ;
$r=mysqli_query($conn,$sql1);
$ra=mysqli_num_rows($r);
if($ra>0){
$_SESSION['mess']="<font color='red'>Product already added!!</font>";
header('location:cart.php');
}else
{
$res=mysqli_query($conn,"INSERT INTO 
`add_wishlist`(`user_id`,`user_name`,`book_id`, `book_name`, `book_edition`, 
`book_offer`, `book_quantity`, `book_image`, `book_rating`, `book_price`, 
`book_delivery_mode`, `book_availability`, `delivery_pin`, 
`current_details`) 


VALUES('$u_id','$u_name','$bid','$name','$edi','$offer',
'$qty','$img','$rat','$price','$mode','$avl','$pin',now())");
if($res==true){
$sql1="DELETE FROM `add_cart` WHERE `book_id`='$bkid' AND
`user_id`='$idd'";
mysqli_query($conn,$sql1);
}
$_SESSION['mess']="<font color='blue'>Your Product added 
Successfully</font>";
header('location:wish-list.php');
}
}
?>
i want that plus minus button to work on every item. any idea will be appreciated 

---

我没有彻底研究代码，但这部分可能是罪魁祸首：
var input=document.getElementById（“number”）；
。您正在while循环中填充项目，但有固定的“number”id。页面上不应该有两个相同的id。id应该是唯一的

您可以在php循环中使用id迭代器

$i = 0;
while($row=mysqli_fetch_assoc($query))
{
    $b_id=$row['book_id'];
    $i++;
?> 

...

<!-- Do this id change for every input -->
<input type="hidden" name="u_id" id="uid_<?php echo $i;?>" value="<?php echo $row['user_id'];?>"/>


编辑。根据更新的代码，您的javascript应实现以下功能：

<script type="text/javascript">
var elements = document.getElementsByName('save');
for(var i in elements) {
    elements[i].onclick = function() {
        var id_help_arr = this.id.split('_');
        var type = id_help_arr[0];
        var input = document.getElementById("number_"+id_help_arr[1]);
        var num = +input.value;
        if(type == 'plus') {
            num++;
        }
        else {
            num--;
        }
        input.value = num;
    }
}
</script>


var elements=document.getElementsByName（'save'）；
for（元素中的变量i）{
元素[i]。onclick=function（）{
var id_help_arr=此.id.split（“”）；
var type=id\u help\u arr[0]；
var input=document.getElementById（“数字”+id\u帮助\u arr[1]）；
var num=+input.value；
如果（类型=='plus'）{
num++；
}
否则{
num--；
}
input.value=num；
}
}

我只使用了一个减号/加号函数，而不是减号/加号函数。它根据输入名称决定是否递增/递减。此函数将添加到所有保存输入中。在原始代码中，您仅将减号/加号函数分配给第一个找到的元素。
谢谢您的帮助，但我对php不熟悉，不知道应该将其放在哪里是第$num\u id=“number”..$i；$min\u id=“减”..$i；$plus\u id=“plus”行_“$i$i++@viliam Abosia我们必须先声明变量i，否则它会抛出error@PrashantBharati我稍微修改了一下答案。更具体地针对您的代码。我真的很感激你试图帮助我，但它不起作用。求你了先生我求你给我找些解决办法已经一个星期了我还没找到solution@PrashantBharati请编辑代码以显示调整后的外观，好吗？
<script type="text/javascript">
var elements = document.getElementsByName('save');
for(var i in elements) {
    elements[i].onclick = function() {
        var id_help_arr = this.id.split('_');
        var type = id_help_arr[0];
        var input = document.getElementById("number_"+id_help_arr[1]);
        var num = +input.value;
        if(type == 'plus') {
            num++;
        }
        else {
            num--;
        }
        input.value = num;
    }
}
</script>