Applying discount codes in the cart (prior to checkout)

Highlighted
Tourist
13 0 0

We've been asked to add an (Apply) Discount Code text input to the client's side cart. I've done some discovery and found a couple apps what say they support this. On the other hand, we naturally want to be thorough and see if we can do it ourselves.  

I created a discount and used apply via link. 

https://help.shopify.com/en/manual/discounts/managing-discount-codes#promote-a-discount-using-a-shar...

When I get to the actual checkout page, the discount shows up (as it should). 

Then I added a get cart (via AJAX) to the side cart (prior to checkout):

https://shopify.dev/docs/themes/ajax-api/reference/cart#get-cart-js

And dump that via console.log() and the cart object returned doesn't show anything about a discount. No code. Nuttin'. 

Yet, if I continue on to checkout, the discount shows up again / still. 

Based on some additional research, evidently there's no way to apply a coupon code via AJAX. The last discussion I found was about a year old. Is there still no relatively easy way to apply a discount via Ajax? 

All that being said, if there are no other options, we'll go the app route. Does anyone have any suggestions for such apps?

 

 

 

 

 

0 Likes
Highlighted
Tourist
13 0 0

Bump. Anyone? Anything?

0 Likes
Highlighted
New Member
2 0 0

Dear friend, I'm struggled in the same situation. Could you find a solution for such problem? I need to apply discount in ajax cart so it's showed on cart like automatic discounts are.

0 Likes
Highlighted
Shopify Partner
3 0 0

Create a new code snippet with cart-apply-discount

{% comment %}
  Replace the text below with the handle of your add-on product.
{% endcomment %}

{% assign product = all_products['put-your-product-handle-here'] %}

{% unless cart.item_count == 0 or product.empty? or product.variants.first.available == false %}

  {% assign variant_id = product.variants.first.id %}

  <script>
  (function($) {

    var cartItems = {{ cart.items | json }},
        qtyInTheCart = 0,
        cartUpdates = {};

    for (var i=0; i<cartItems.length; i++) {
      if ( cartItems[i].id === {{ variant_id }} ) {
        qtyInTheCart = cartItems[i].quantity;
        break;
      }
    }

    if ( ( cartItems.length === 1 ) && ( qtyInTheCart > 0 ) ) {
      cartUpdates = { {{ variant_id }}: 0 }
    }
    else if ( ( cartItems.length >= 1 ) && ( qtyInTheCart !== 1 ) ) {
      cartUpdates = { {{ variant_id }}: 1 }
    }
    else {
      return;
    }

    var params = {
      type: 'POST',
      url: '/cart/update.js',
      data: { updates: cartUpdates },
      dataType: 'json',
      success: function(stuff) { 
        window.location.href = '/cart';
      }
    };

    $.ajax(params);

  })(jQuery);
  </script>

{% endunless %}

Include the new snippet in your cart.liquid template

{% include 'cart-discount' %}

 

0 Likes
Highlighted
New Member
2 0 0

Thanks for replying @SantoshKori . 

I can't see excatly in your code where are you applying a discount code. Can you explain it to me?

As I can see, you're only updating quantity of an item.

Thnaks again.

0 Likes