Hey guys
I have some problem for counting (products) in cart dynamically with ajax when clicking on (add to cart) "button":
for example: consider that there's only one product in cart, user clicks (add to cart) "button", show div with message added plus count products in cart dynmically
Here's my php code (counter of products in cart):
<span class="products-in-cart">
( <?= isset($cart_id) ? $cartObj->countProductsInCartByCartId($cart_id) : "0" ?> )
</span>
and here's jquery code (ajax):
$(document).ready(function () {
var addToCart = $('input[name=addToCart]');
addToCart.on('click', function () {
var productId = $(this).parent().find('input[name=productId]').val();
var data = {
productId: productId,
addToCart: true
};
var url = "addToCart.php";
$.post(url, data, function () {
var div = $("<div></div>");
div.addClass('addedToCart'); $("body").append(div.hide().text("added").fadeIn(500).delay(1000).fadeOut(500));
var speed = 500;
$("body").append(div.css('display','none').text("added").css({'display':'block', 'opacity':'0'}).animate({'opacity':'1'}, speed).delay(1000).animate({'opacity':'0'}, speed,function(){
$(this).remove();
}));
});
});
$('form.cartOperations').submit(function () {
return false;
});
});