CODEWITHSUNDEEP
javascriptphpjquerysimplecart
Mad Coder
Mad Coder

Reputation: 117

After Append Product` add to cart` is not working

I have div as follows

<li>
  <a data-id="'.$row_p[0].'" data-name="'.$row_p[3].'" data-summary="'.$row_p[3].'" data-price="'.$row_p[6].'" data-quantity="1" data-image="'.$row_p[12].'" class="add-cart">
  <span class="icon flaticon-shopping66 "></span>
  </a>
</li>

On add-cart click Following Function calls(it is an ready plugin that is easily available to show an cart.)

    $('.add-cart').myCart({
          classCartIcon: 'my-cart-icon',
          classCartBadge: 'my-cart-badge',
          classProductQuantity: 'my-product-quantity',
          classProductRemove: 'my-product-remove',
          classCheckoutCart: 'my-cart-checkout',
          affixCartIcon: true,
          showCheckoutModal: true,
          clickOnAddToCart: function($addTocart){
            goToCartIcon($addTocart);
          },
          clickOnCartIcon: function($cartIcon, products, totalPrice, totalQuantity) {
            console.log("cart icon clicked", $cartIcon, products, totalPrice, totalQuantity);
          },
          checkoutCart: function(products, totalPrice, totalQuantity) {
            console.log("checking out", products, totalPrice, totalQuantity);
          },
          getDiscountPrice: function(products, totalPrice, totalQuantity) {
            console.log("calculating discount", products, totalPrice, totalQuantity);
            return totalPrice;
          }
        });
But Now the problem is i am using load more jquery Which Load Data On Scroll `$(window).scroll(function()..`  So on scroll i am showing Div As Following

    $.ajax({
        url: 'ajax-load-subcat.php',
        type: 'post',
        data: {row:row,idsubcat:idsubcat},
        beforeSend: function() {
          $("#dataload").show();
        },
        success: function(response){
          $(".post:last").after(response).show().fadeIn("fast");
          $("#dataload").hide();
        }
    });

So After Dive is appended the add-cart function is also closed. means it isn't responding. so how can i re-start my cart when i scroll and data is loaded.

I have searched a lot. but they didn't solves my problem. thank you.

Upvotes: 0

Views: 194

Answers (1)

Mad Coder
Mad Coder

Reputation: 117

Try to initialize add-class/add-cart function again on success of ajax

$.ajax({
    url: 'ajax-load-subcat.php',
    type: 'post',
    data: {row:row,idsubcat:idsubcat},
    beforeSend: function() {
      $("#dataload").show();
    },
    success: function(response){
      $(".post:last").after(response).show().fadeIn("fast");
      $("#dataload").hide();
      //Re-intiallize Function
      $('.add-cart').myCart({
         ....
      });
    }
});

Upvotes: 0

Related Questions