Register with your Envato account

Support forums

Homepage Support Polaris Shopify cart.liquid: Hide/disable proceed to checkout btn till item_count = X

[Resolved] cart.liquid: Hide/disable proceed to checkout btn till item_count = X

Homepage Support Polaris Shopify cart.liquid: Hide/disable proceed to checkout btn till item_count = X

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #7179
    leahprin
    Participant

    I realise this is beyond the normal support terms, but if you can help that would be amazing! My JS skills are not the best.

    Currently in cart.liquid I am hiding the Proceed to checkout button if there are less than 10 items in the cart with:

    {% if cart.item_count < 10 %}
    {% else %}
    <input type="submit" name="checkout" class="proceed-checkout" value="{{ 'cart.general.checkout' | t }}"><a id="proceed-checkout" href="#" class="btn-medium-1">{{ 'cart.general.checkout' | t }}</a>
    {% endif %}

    This works fine, but allows the user to proceed to checkout if they add 10 items… then remove some items… but don’t update the cart (or refresh the page). Ideally I’d like to do this via JS onClick of the item quantities.

    – OnClick of item qty – + buttons it checks api response of cart.js for item_count
    – Until user has 10 items in cart a#proceed-checkout is hidden or disabled

    If you could help that would be great! My googlefu is failing me.

    #7181

    Hey,

    As you already mentioned such a cases are not covered by Theme support. I am not able to code this feature completely but I will give you a good clue.

    First of all in cart.liquid you should just add some class to the anchor tag with ID #proceed-checkout rather than remove all the HTML related to the button. You can add class “disabled” when item count is less than 10 and style this class when it is added to #proceed-checkout using CSS.

    Next open asset with name “polaris.js” and find function “initAjaxCartQuantityChange”. Locate success callback and right before its’ closing bracket paste this code:

    if(msg.item_count > 9)
    	jQuery('#proceed-checkout').removeClass('disabled');
    else 
    	jQuery('#proceed-checkout').addClass('disabled');
    #7328
    leahprin
    Participant

    Awesome, got it sorted. Thanks so much for your help. Just rated you 5 stars on theme forest. Your support has really been above and beyond, thank you 🙂

    #7333

    Thank you for the 5 stars. Let us know if you have any questions 😉

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘cart.liquid: Hide/disable proceed to checkout btn till item_count = X’ is closed to new replies.

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close