商品はカートに行きますが、私がクリックしたボックスに確認テキストを表示したい

Question

商品のリストがあります。アイテムリストはデータベースからのものです。

私が行ったこと： - アイテムリストからカートボタンに追加をクリックすると、うまくいきます、アイテムはカートに行きます。

私が欲しいもの： - 私がクリックしたボックスに確認テキストを表示したいと思います。結果はすべての部門に表示されます。ここで

は私のコードです：クラスセレクタとして

<div class="col-md-6"> 
<div class=" product-list clearfix" style="float:left"> 
    <?php foreach ($product as $key => $product) { ?> 
    <div class="product clearfix"> 
    <figure> 
     <a href="<?php echo base_url(); ?>index/productDetails/<?php echo $product->productId; ?>"> 
     <img src="<?php echo $product->productImage; ?>" alt="" height="100%"> 
     </a> 
     </figure> 
     <div class="detail"> 
      <h4><a href="<?php echo base_url(); ?>index/productDetails/<?php echo $product->productId; ?>"> 
      <?php echo $product->productName; ?> 
      </a></h4> 
      <?php 
      $this->load->helper('text'); 
      $string = $product->productDescription; 
      echo $string = word_limiter($string, 10); 
      ?> 
     </div> 
     <div class="proPrice"> 
      <?php echo $product->productPrice; ?>/= 
      <div class="icon"> 
       <input type="hidden" class="productId" value="<?php echo $product->productId; ?>"> 
       <a href="#" class="addToCart"><span class="glyphicon glyphicon-shopping-cart"></span></a> 
       <span class="glyphicon glyphicon-copy"></span> 
      </div> 
     </div> 
     <div class="result2"></div> 
    </div> 
    <?php $i++; } ?> 
    <p><?php echo $links; ?></p> 
</div> 

$(document).ready(function(){ 
    $(".addToCart").click(function(){ 
     var productId = $(this).siblings(".productId").val(); 

     $.ajax({ 
      url:'<?php echo site_url('cart/addToCart/'); ?>', 
      data:{productId:productId}, 
      type:'POST', 
      success:function(data){ 
       // Change css value of "result" div and Display 
       $(".result2").css("display", "block"); 
       $(".result2").html(data); 
      } 
     }); 
    }); 
}); 

Answer 1

コレクションを返すので、すべてのdivは、同じメッセージを取得します。代わりに、セレクタのコンテキスト内のdivを次のように取得します。

$(".addToCart").click(function(){ 
    var productId = $(this).siblings(".productId").val(); 
    var $resltDiv = $(this).closest('.proPrice').next('.result2'); // get the div here 
    $.ajax({ 
     url:'<?php echo site_url('cart/addToCart/'); ?>', 
     data:{productId:productId}, 
     type:'POST', 
     success:function(data){ 
      // Change css value of "result" div and Display 
      $resltDiv.html(data).show(); // put the data and show it here. 
     } 
    }); 
});