ajax通話只返回最後一個ID

我想通過ajax開發一個添加到購物車功能，問題是無論我添加到購物車的哪個產品，它都會將最後一個項目添加到列表中，然後增加相同的產品點擊任何其他產品。這裏是我的代碼： -ajax通話只返回最後一個ID

<?php   
    $i = 1; 
    while($row = mysqli_fetch_array($run_products)){ 
    $op_id = $row['option_id']; 

    echo "<tr>"; 
    echo "<td>" . $i . "</td>"; 
    echo "<td>" . $row['option_desc'] . "</td>";  
    echo "<td> 

    <form action='' method='post' class='p_form'> 
     <input type='text' name='product_id' value='$op_id' pid='$op_id'> 
     <input type='text' name='quantity' value='1' pid='$op_id'> 
     <input class='btn btn-primary add' type='submit' name='add_to_cart' value='Add to Cart' id='product' pid='$op_id'> 
    </form> 
    </td>"; 
    echo "</tr>";   
    $i++; 
} 
?>

這裏是jQuery的：

<script type="text/javascript"> 

$(document).ready(function(){ 

    $(document).on('click','.p_form',function (event) {  
     event.preventDefault(); 

     var element = $(this); 
     var id = element.attr("pid"); 
     //alert(id); 

       $.ajax({ 

        url: 'action.php', 
        method: 'post', 
        //data: {id:id}, 
        data:$('.p_form').serialize(), 
        success: function(data){ 

         $('#message').html(data);       
        } 
       }); 

     return false; 

    }); 

}); 
</script>

下面是action.php，在$ PRODUCT_ID總是返回爲4（例如），如果在最後的最後一個ID爲4

按鈕

if (!empty($_POST)){ 
    $product_id = $_POST['product_id']; 
    echo $product_id; 
}

來源

2017-04-04 Kaleem Shahid

在阿賈克斯你使用數據：$序列化（）（ 'p_form。'）。，這意味着它將採用多個類中的最後一個值。所以你可以做的是爲每個表單創建不同的類名或ID並獲得該值。所以不會有任何重複的問題 – Karthick

，因爲您正在創建具有相同名稱的相同表單。所以它只會採取最後的形式。 – Gaurav

使用'data：$（this）.serialize（）' – Phil

需要做的是象下面這樣： -

<script type="text/javascript"> 

$(document).ready(function(){ 
    $(document).on('click','.add',function (event) {//instead of form click add event on form button click  
     event.preventDefault(); 
     var element = $(this); 
     var id = element.attr("pid"); 
     //alert(id); 

      $.ajax({ 
       url: 'action.php', 
       method: 'post', 
       data:element.parent('.p_form').serialize(), //serialize clicked button parent form 
       success: function(data){ 
        $('#message').html(data);       
       } 
      }); 
     return false; 
    }); 
}); 
</script>

來源

2017-04-04 05:22:13

謝謝，你能解釋一下你的代碼中發生了什麼嗎？ –

@KaleemShahid已經通過評論解釋。這很簡單。我已將點擊事件添加到每個表單提交按鈕。當任何按鈕點擊我試圖獲取它的相應的形式和序列化。謝謝 –

觸發click事件點擊不在形式點擊：

這將y的工作ou爲每個產品。

<script type="text/javascript"> 

$(document).ready(function(){ 

    $(document).on('click','.add',function (event) {  
     event.preventDefault(); 

     var element = $(this); 
     var id = element.attr("pid"); 
     //alert(id); 

       $.ajax({ 

        url: 'action.php', 
        method: 'post', 
        data: {id:id}, //send id of product you wish to add 
        success: function(data){ 

         $('#message').html(data);       
        } 
       }); 

     return false; 

    }); 

}); 
</script>

而在服務器端：

if (!empty($_POST)){ 
    $product_id = $_POST['id'];//get only that id posted in ajax call 
    echo $product_id; 
}

來源

2017-04-04 05:19:26

ajax通話只返回最後一個ID

回答

相關問題