Shopify Question posted in
The Shopify help center can be found here.

Shopify + CartJS updating total price with JS?

I’m trying to update some data with AJAX on my Shopify theme, I’m also using the CartJS plugin. I have the counter working find but when I come to update the price it doesn’t format correctly. It does add all the correct numbers but misses out any currency symbol or decimal point.

Here’s the code snippet:

<div id="mini-cart">
    <h2>Basket Updated <span class="btn-close">x</span></h2>
    <p><strong class="item-count">{{ cart.item_count }}</strong> item(s). Costing <strong class="total-price">{{ cart.total_price | money }}</strong></p>
</div>

<script>
    $(document).on('cart.requestComplete', function(event, cart) {

        $('.item-count').html(cart.item_count);
        $('.total-price').html(cart.total_price);
    });
</script>

I think it has something to do with {{ cart.total_price | money }} but whenever I add the | money bit into the JS the whole thing breaks. Is there a way to format that in the script?

Thanks!

Tags:

2

Answers


  1. 0

    You should be sure to load also the option_selection.js library in your theme.liquid here is the string to add:

    {{ 'option_selection.js' | shopify_asset_url | script_tag }}

    Ref. https://cartjs.org/pages/guide#getting-started-setup

    Login or Signup to reply.
  2. 0

    You need to add use data-cart-view to display values and products from your cart. Simply use:

    <span data-cart-view>
Costing <strong class="total-price">{{ cart.total_price | money }}</strong>
</span>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search