Why isn't my Shopify cart updating when product amounts change?

LauraLopez
New Member
7 0 0

When viewing cart, if the product amounts get modified manually, the user gets stuck.

It is asked, "Cart needs to be updated" but it's not a button for it.

Can you please advice how to sort this?

Replies 4 (4)

Propero
Shopify Partner
895 101 160

@LauraLopez ,

If your cart is an ajax cart it should do this dynamically, otherwise you would have an update button. It would be good to share the URL of store so someone can check.

 

- Was my reply helpful? Click Like or Click Accept as Solution
To hire: email us at shopify@propero.in
checkout our app https://apps.shopify.com/picamaze
LauraLopez
New Member
7 0 0

Hi, 

 

I'm not sure about the ajax cart, how can I know about this?

There is not an update cart button.

 

 Here link to site; https://plaato.io/cart

Propero
Shopify Partner
895 101 160

@LauraLopez ,

Did someone make any change in the code recently? the option to update is removed and cart is not supporting ajax. If this was working earlier, then you may revert to the last working version or take a fresh copy of the theme.

Another option is to hire an expert to troubleshoot this issue.

- Was my reply helpful? Click Like or Click Accept as Solution
To hire: email us at shopify@propero.in
checkout our app https://apps.shopify.com/picamaze
LauraLopez
New Member
7 0 0

I have reset the theme, and in there this function works. It gets update automatically.

 

So on the file cart-template.liquid

this is the code now: 

 

<div class="container main content main-wrapper">
<div class="sixteen columns clearfix collection_nav">
<h1 class="center">{{ 'cart.general.title' | t }}</h1>
<div class="feature_divider"></div>
</div>

{% if cart.item_count == 0 %}
<div class="sixteen columns">
<div class="section clearfix">
<p class="quote">{{ 'cart.general.continue_browsing_html' | t }}</p>
</div>
</div>
{% else %}
<form action="/cart" method="post" id="cart_form">
<div class="section clearfix">
<div class="ten columns cart_items">
<h4 class="title">{{ 'cart.general.products' | t }}</h4>

{% for item in cart.items %}
<div class="five columns alpha">
<a href="{{ item.url }}" title="{{ item.title | escape }}" class="cart_page_image">
<img src="{{ item | img_url: '300x' }}"
alt="{{ item.title | escape }}"
class="lazyload lazyload--fade-in"
style="max-width: {{- item.image.width -}}px"
data-sizes="auto"
data-src="{{ item | img_url: '900x' }}"
data-srcset=" {{ item | img_url: '2048x' }} 2048w,
{{ item | img_url: '1600x' }} 1600w,
{{ item | img_url: '1200x' }} 1200w,
{{ item | img_url: '1000x' }} 1000w,
{{ item | img_url: '800x' }} 800w,
{{ item | img_url: '600x' }} 600w,
{{ item | img_url: '400x' }} 400w"
/>
</a>
</div>

<div class="five columns omega">
<p>
<a href="{{ item.url }}">
{{ item.product.title }}
<span class='booster-cart-item-success-notes' data-key='{{item.key}}'></span><span class='booster-cart-item-upsell-notes' data-key='{{item.key}}'></span>
</a>
</p>
{% unless item.product.has_only_default_variant or item.variant.title contains "Title" %}
<p class="meta">
{% for option in item.product.options %}
{% unless option contains "Title" %}
<span class="label">{{ option }}:</span> <span>{{ item.variant.options[forloop.index0] }}</span><br />
{% endunless %}
{% endfor %}
</p>
{% endunless %}

{% if item.properties %}
<p>
{% for p in item.properties %}
{% unless p.last == blank %}
{% if p.last contains '/uploads/' %}
{{ p.first }}: <a class="lightbox" href="{{ p.last }}">{{ 'cart.general.uploaded_file' | t }}</a><br />
{% else %}
{{ p.first }}: {{ p.last }}<br />
{% endif %}
{% endunless %}
{% endfor %}
</p>
{% endif %}

<p class="price_total">
<strong>{{ 'cart.general.price_per_item' | t }}:</strong>
{% if item.line_level_discount_allocations.size > 0 %}
<span class="money">
{{ item.final_price | money }}
</span>
{% endif %}
<span class="money {% if item.line_level_discount_allocations.size > 0 %}was_price{% endif %}">
{{ item.original_price | money }}
</span>
</p>

<p id="quantity_{{ forloop.index }}">
<label for="updates_{{ item.id }}" class="quantity_label">{{ 'cart.general.quantity' | t }}:</label>
<input type="number" min="0" size="3" maxlength="3" class="quantity" name="updates[]" id="updates_{{ item.id }}" value="{{ item.quantity }}" data-line-id="{{ forloop.index }}" {% if settings.limit_quantity and item.variant.inventory_management != blank and item.variant.inventory_quantity > 0 and item.variant.inventory_policy == "deny" %}max="{{ item.variant.inventory_quantity }}"{% endif %} />
</p>

{% if item.line_level_discount_allocations.size > 0 %}
{% for discount_allocation in item.line_level_discount_allocations %}
<p class ="applied_discount">
<strong>{{ 'cart.general.discount' | t }}:</strong> {{ discount_allocation.discount_application.title }} (- <span class="money">{{ discount_allocation.amount | money }}</span>)
</p>
{% endfor %}
{% endif %}

<p class="price_total">
<strong>{{ 'cart.general.total' | t }}:</strong>
{% if item.line_level_discount_allocations.size > 0 %}
<span class="money">
{{ item.final_line_price | money }}
</span>
{% endif %}
<span class="money {% if item.line_level_discount_allocations.size > 0 %} hidden {% endif %}">
<span class='booster-cart-item-line-price' data-key='{{item.key}}'>{{ item.original_line_price | money }}</span>
</span>
</p>

<p class="remove_item">
<a href="/cart/change?line={{ forloop.index }}&amp;quantity=0" title="{{ 'cart.general.remove' | t }}">{{ 'cart.general.remove' | t }}</a>
</p>
</div>
<br class="clear" />
<br class="clear" />
{% endfor %}
</div>

<div class="five columns offset-by-one">

{% if cart.cart_level_discount_applications != blank %}
<h4 class="discount">
{{ 'cart.general.discount' | t }}
</h4>

{% for discount_application in cart.cart_level_discount_applications %}
<p>
{{ discount_application.title }} (- <span class="money">{{ discount_application.total_allocated_amount | money }}</span>)
</p>
{% endfor %}
{% endif %}

<h4 class="subtotal">
{{ 'cart.general.subtotal' | t }}
</h4>

{% comment %} <script>
$.get("http://freegeoip.app/json/", function (response) {
if (response.country_code != 'CA' || response.country_code != 'US' || response.country_code != 'AU') {
document.getElementById("tax-and-vat").style.display = "inline";
}
}, "jsonp");
</script> {% endcomment %}

<p class="subtotal_amount">
<strong>
<span class="money"><span class="wh-original-cart-total"><span class='wh-original-price'>{{ cart.total_price | money_with_currency }}</span></span><span class="wh-cart-total"></span><div class="additional-notes"><span class="wh-minimums-note"></span><span class="wh-extra-note"></span></div></span>
</strong>
{% comment %}
<small id="estimated-shipping" style="display:none">+ <em><span class="money">{{ 0 | money }}</span> {{ 'cart.shipping_calculator.estimated_shipping' | t }}</em></small>
{% endcomment %}

{% comment %} <small id="tax-and-vat" style="display:none;" class="excluding_tax"><em>Tax and VAT not included</em></small> {% endcomment %}
</p>

{% if settings.show_multiple_currencies %}
<p>
<small>
{{ 'cart.general.orders_processed_in_currency_html' | t: currency: shop.currency }}
</small>
</p>
{% endif %}

{% if section.settings.display_special_instructions %}
<label for="cart-note">{{ 'cart.general.note' | t: shop_name: shop.name }}:</label>
<textarea id="cart-note" name="note" rows="2">{{ cart.note }}</textarea>
{% endif %}

{% if settings.display_tos_checkbox %}
<div class="tos_checkbox">
<input type="checkbox" class="tos_agree" id="cart_agree" required />
<label class="tos_label" for="cart_agree">
{{ settings.tos_richtext }}
</label>
</div>
{% endif %}

<p class="add-to-cart-wrap">
<input type="submit" class="action_button add_to_cart" id="checkout" name="checkout" value="{{ 'cart.general.checkout' | t }}" />
</p>

<img style="padding-top: 35px;" src="https://cdn.shopify.com/s/files/1/0045/5917/5752/files/secure_guarantee.png?11254"></img>

{% if content_for_additional_checkout_buttons %}
<div class="additional-checkout-buttons">
{{ content_for_additional_checkout_buttons }}
</div>
{% endif %}

{% if cart.item_count > 0 and section.settings.display_continue_shopping %}
<p class="continue_shopping">
<a href="{% if cart.items.first.product.collections != blank %}{{ cart.items.first.product.collections.last.url }}{% else %}/collections/all{% endif %}">{{ 'cart.general.continue_shopping_link_html' | t }}</a>
</p>
{% endif %}
</div>
</div>
</form>
{% endif %}
</div>

{% schema %}

{
"name": "Cart page",
"class": "cart-section",
"settings": [
{
"type": "checkbox",
"id": "display_continue_shopping",
"label": "Show \"continue shopping\" link",
"default": true
},
{
"type": "checkbox",
"id": "display_special_instructions",
"label": "Show \"note\" text box"
}
]
}

{% endschema %}

 

 

 

 

this is the code on the template reset:

 

<div class="container main content main-wrapper">
<div class="sixteen columns clearfix collection_nav">
<h1 class="center">{{ 'cart.general.title' | t }}</h1>
<div class="feature_divider"></div>
</div>

{% if cart.item_count == 0 %}
<div class="sixteen columns">
<div class="section clearfix">
<p class="quote">{{ 'cart.general.continue_browsing_html' | t }}</p>
</div>
</div>
{% else %}
<form action="{{ routes.cart_url }}" method="post" id="cart_form">
<div class="section clearfix">
<div class="ten columns cart_items">
<h4 class="title">{{ 'cart.general.products' | t }}</h4>

{% for item in cart.items %}
<div class="five columns alpha">
<a href="{{ item.url }}" title="{{ item.title | escape }}" class="cart_page_image">
{% if item.image %}
{% render 'image-element',
image: item.image,
alt: item.title
%}
<noscript>
{% render 'image-element',
image: item.image,
alt: item.title
%}
</noscript>
{% endif %}
</a>
</div>

<div class="five columns omega">
<p>
<a href="{{ item.url }}">
{{ item.product.title }}
</a>
</p>
{% unless item.product.has_only_default_variant or item.variant.title contains "Title" %}
<p class="meta">
{% for option in item.product.options %}
{% unless option contains "Title" %}
<span class="label">{{ option }}:</span> <span>{{ item.variant.options[forloop.index0] }}</span><br />
{% endunless %}
{% endfor %}
</p>
{% endunless %}

{% if item.properties %}
<p>
{% for p in item.properties %}
{% unless p.last == blank %}
{% if p.last contains '/uploads/' %}
{{ p.first }}: <a class="lightbox" href="{{ p.last }}">{{ 'cart.general.uploaded_file' | t }}</a><br />
{% else %}
{{ p.first }}: {{ p.last }}<br />
{% endif %}
{% endunless %}
{% endfor %}
</p>
{% endif %}

<p class="price_total">
<strong>{{ 'cart.general.price_per_item' | t }}:</strong>
{% if item.line_level_discount_allocations.size > 0 %}
<span class="money">
{% render 'price-element', price: item.final_price %}
</span>
{% endif %}
<span class="money {% if item.line_level_discount_allocations.size > 0 %}was_price{% endif %}">
{% render 'price-element', price: item.original_price %}
</span>
</p>

<p id="quantity_{{ forloop.index }}">
<label for="updates_{{ item.id }}" class="quantity_label">{{ 'cart.general.quantity' | t }}:</label>
<input type="number" min="0" size="3" maxlength="3" class="quantity" name="updates[]" id="updates_{{ item.id }}" value="{{ item.quantity }}" data-line-id="{{ forloop.index }}" {% if settings.limit_quantity and item.variant.inventory_management != blank and item.variant.inventory_quantity > 0 and item.variant.inventory_policy == "deny" %}max="{{ item.variant.inventory_quantity }}"{% endif %} />
</p>

{% if item.line_level_discount_allocations.size > 0 %}
{% for discount_allocation in item.line_level_discount_allocations %}
<p class ="applied_discount">
<strong>{{ 'cart.general.discount' | t }}:</strong> {{ discount_allocation.discount_application.title }} (- <span class="money">
{% render 'price-element', price: discount_allocation.amount %}
</span>)
</p>
{% endfor %}
{% endif %}

<p class="price_total">
<strong>{{ 'cart.general.total' | t }}:</strong>
{% if item.line_level_discount_allocations.size > 0 %}
<span class="money">
{% render 'price-element', price: item.final_line_price %}
</span>
{% endif %}
<span class="money {% if item.line_level_discount_allocations.size > 0 %} hidden {% endif %}">
{% render 'price-element', price: item.original_line_price %}
</span>
</p>

<p class="remove_item">
<a href="{{ routes.cart_change_url }}?line={{ forloop.index }}&amp;quantity=0" title="{{ 'cart.general.remove' | t }}">{{ 'cart.general.remove' | t }}</a>
</p>
</div>
<br class="clear" />
<br class="clear" />
{% endfor %}
</div>

<div class="five columns offset-by-one">

{% if cart.cart_level_discount_applications != blank %}
<h4 class="discount">
{{ 'cart.general.discount' | t }}
</h4>

{% for discount_application in cart.cart_level_discount_applications %}
<p>
{{ discount_application.title }} (- <span class="money">
{% render 'price-element', price: discount_application.total_allocated_amount %}
</span>)
</p>
{% endfor %}
{% endif %}

<h4 class="subtotal">
{{ 'cart.general.subtotal' | t }}
</h4>

<p class="subtotal_amount">
<strong>
<span class="money">
{% render 'price-element', price: cart.total_price %}
</span>
</strong>

<small class="excluding_tax"><em>{{ 'cart.general.excluding_tax_shipping' | t }}</em></small>
</p>

{% if section.settings.display_special_instructions %}
<label for="cart-note">{{ 'cart.general.note' | t: shop_name: shop.name }}:</label>
<textarea id="cart-note" name="note" rows="2">{{ cart.note }}</textarea>
{% endif %}

{% if settings.display_tos_checkbox %}
<div class="tos_checkbox">
<input type="checkbox" class="tos_agree" id="cart_agree" required />
<label class="tos_label" for="cart_agree">
{{ settings.tos_richtext }}
</label>
</div>
{% endif %}

<p class="add-to-cart-wrap">
<input type="submit" class="action_button add_to_cart" id="checkout" name="checkout" value="{{ 'cart.general.checkout' | t }}" />
</p>

{% if content_for_additional_checkout_buttons %}
<div class="additional-checkout-buttons additional-checkout-buttons--vertical">
{{ content_for_additional_checkout_buttons }}
</div>
{% endif %}

{% if cart.item_count > 0 and section.settings.display_continue_shopping %}
<p class="continue_shopping">
<a href="{% if cart.items.first.product.collections != blank %}{{ cart.items.first.product.collections.last.url }}{% else %}{{ routes.all_products_collection_url }}{% endif %}">{{ 'cart.general.continue_shopping_link_html' | t }}</a>
</p>
{% endif %}
</div>
</div>
</form>
{% endif %}
</div>

{% schema %}

{
"name": "Cart page",
"class": "cart-section",
"settings": [
{
"type": "checkbox",
"id": "display_continue_shopping",
"label": "Show \"continue shopping\" link",
"default": true
},
{
"type": "checkbox",
"id": "display_special_instructions",
"label": "Show \"note\" text box"
}
]
}

{% endschema %}

 

 

I have tried copy and paste on the current theme this code, although gives errors

Can someone advice?

 

Thanks!