CODEWITHSUNDEEP
javascriptjqueryjquery-eventsminicart
T3.0
T3.0

Reputation: 496

Minicart.js - Items are added to cart but cart not displaying

I have a click function on a button that adds an item to my cart using the Minicart.js library from minicartjs.com. When the button is clicked items are being added to the cart however, the cart is not popping up as expected. I've tested this on up to date versions of Chrome and IE (IE 11).

Some things I've noticed:

Chrome debugger showing body tag with class and ppminicart div

The following script is at the end of a MVC partial View:

<script src="~/Scripts/minicart.js"></script>
<script>
    $(".showcart").click(function () {
        var data = $(this).attr("data-id");   
        paypal.minicart.cart.add(JSON.parse(data));
        // $("#body").toggleClass("minicart-showing"); <---doesn't work
        // paypal.minicart.view.show() <---- doesn't work
    });
paypal.minicart.render();
</script>

Upvotes: 0

Views: 1205

Answers (1)

T3.0
T3.0

Reputation: 496

After further reviewing the minicartjs examples in the author's repository. I found that using e.stopPropagation() within the click function resolves the issue.

   $(".showcart").click(function (e) { // <--- added the e function
    var data = $(this).attr("data-id");
    e.stopPropagation(); // <--- And this line.
    paypal.minicart.cart.add(JSON.parse(data));
});

Code Example From Author's GitHub Repo

Upvotes: 1

Related Questions