Question

<?php foreach ($memberData as $c) {?>
    <tr>
      <td><?php echo $c->name;?></td>
      <td> 1 year</td>
      <td><div class="calActivitylPrice"> <?php echo $c->Fees;?></div></td>
      <td>
          <div class="display_table"><?php if($c->member_approve==1){?>
          <button type="button" name="renew" class="btn btn-success add_cart" data-productname="membership" data-price="" data-productid="1" />Add to cart</button><?php }else{?><div class="redDot statusDot"></div><div class="activity_status">Not Approved</div><?php };?>
         </div>
      </td>

    </tr>
<?php }?>

以上代码的输出为

Alex | 1 Year | 500 | Add to cart
blex | 1 Year | 300 | Add to cart
clex | 1 Year | 200 | Add to cart

现在，当用户单击Add to cart按钮时，产品将添加到购物车中，并且使用jQuery，按钮将从add to cart变为remove。下面是添加到购物车并将按钮从add to cart更改为remove的代码。

添加到购物车

$(document).ready(function(){

 $('.add_cart').click(function(){
  var product_name = $(this).data("productname");
  var product_id = $(this).data("productid");
  var product_price = $(this).closest('tr').find('.calActivitylPrice').text();
  var quantity =1 ;

  var changeToRemoveBTNSec = $(this).closest('tr').find('.display_table');

   $.ajax({
    url:"<?php echo base_url(); ?>Member_controller/addToCart",
    method:"POST",
    data:{product_id:product_id, product_name:product_name, product_price:product_price,quantity:quantity},
    success:function(data)
    {
        var obj = JSON.parse(data);

    $(changeToRemoveBTNSec).html('<button type="button" name="remove" class="btn btn-danger remove_inventory" id="'+obj.removebtn+'">Remove</button>');

     $('#totalDetails').html(obj.cart_total);          
     $('#totalQty').html(obj.totalQty);
    }
   });

 });

});

将产品添加到购物车后，我会看到“删除”按钮，因此我的列表是

Alex | 1 Year | 500 | Add to cart
blex | 1 Year | 300 | remove
clex | 1 Year | 200 | remove

现在，如果我单击删除按钮，那么该产品也会从购物车中删除，并且按钮从remove更改为add to cart，并且脚本在下面

从购物车中删除

 $(document).on('click', '.remove_inventory', function(){
  var row_id = $(this).attr("id");
  var changeToAddtocartBTN = $(this).closest('tr').find('.display_table');

  if(confirm("Are you sure you want to remove this?"))
  {
   $.ajax({
    url:"<?php echo base_url(); ?>Member_controller/Removecart",
    method:"POST",
    data:{row_id:row_id},
    success:function(data)
    {
        var obj = JSON.parse(data);
        alert("Product removed from Cart");


      $(changeToAddtocartBTN).html('<button type="button" name="renew" class="btn btn-success add_cart" data-productname=cmembership" data-price="" data-productid="-3">Add to cart</button>');


    }
   });
  }
  else
  {
   return false;
  }
 });

以上情况对我来说都是有效的。现在出现问题，因为add to cart按钮不起作用，我无法再次添加产品。因为这一次并没有获得产品名称和所有信息。

在这个问题上您能帮我吗？

Answer 1

将添加到购物车功能从.click更改为.on

$(document).on('click', '.add_cart', function() {
    var product_name = $(this).data("productname");
    var product_id = $(this).data("productid");
    var product_price = $(this).closest('tr').find('.calActivitylPrice').text();
    var quantity = 1;

    var changeToRemoveBTNSec = $(this).closest('tr').find('.display_table');

    $.ajax({
        url: "<?php echo base_url(); ?>Member_controller/addToCart",
        method: "POST",
        data: {
            product_id: product_id,
            product_name: product_name,
            product_price: product_price,
            quantity: quantity
        },
        success: function(data) {
            var obj = JSON.parse(data);

            $(changeToRemoveBTNSec).html('<button type="button" name="remove" class="btn btn-danger remove_inventory" id="' + obj.removebtn + '">Remove</button>');

            $('#totalDetails').html(obj.cart_total);
            $('#totalQty').html(obj.totalQty);
        }
    });

});

如何将产品再次添加到购物车或“添加到购物车”按钮不起作用？

1 个答案: