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

Update code based on cart changes – Shopify

I am using cart.js, and been using it for a long time on my stores. I am working on a count down to free shipping based on the cart.total.price. It should be pretty simple, but I can’t get the #counter and cart.total_price to be updated based on cart update.

{% assign some_number = 50000 | minus: cart.total_price %}
<div data-cart-view>
<span class="cart-count" rv-show="cart.total_price | gt 50000">You qualify for free delivery!</span>
<span class="cart-count" rv-show="cart.total_price | lt 50000">If you spend <span id="counter">{{ 50000 | minus: cart.total_price | money }}</span> more you will qualify for free delivery.</span>
</div>

How may I update #counter based on changes done to the cart? I have tried something like this:

<script type="text/javascript">
            $(document).on('cart.requestComplete', function(event, cart) {
                $('#counter').html();
            });
</script>
Tags:

2

Answers


  1. 0

    It is the ordering of your liquid. Your code:

    {{ 50000 | minus: cart.total_price | money }}

    Reads as take 50000 and minus something formatted as $xx.yy. Instead do the minus first and then apply the money filter. As a guess, in two steps:

    {% assign some_number = 50000 | minus: cart.total_price %}
<span>{{ some_number | money }}</span>
    Login or Signup to reply.
  2. 0

    You are mixing paradigms.

    Your initial code block is liquid. It will be processed server side when the page loads.

    Your second block is Javascript. It runs client side when some process updates the cart.

    You can:

    • use javascript to format and update your message (depending on your site’s audience the easy thing that’s also user friendly)
    • use javascript to trigger a page reload (the easiest thing but why not just submit your add to cart and let the natural page load do the work?)
    • use javascript to pull a snippet, wrapped in a template using an empty layout to replace the money with values formatted server side. (actually viable but I’m not sure I’d do this for such a simple thing )
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search