Get product compare_at_price via AJAX

ToTheMoon
Tourist
9 0 0

Hi, I'm using Venture Theme and I would like to display compare_at_price in the cart. I edit the code in cart.liquid and it works but when I want to update the cart using quantity selector it disappears.

 

So I need to use AJAX to have the compare_at_price. I went to https://help.shopify.com/en/api/reference/shipping-and-fulfillment/fulfillment to see the "line_items" properties but I can't find how to get product compare_at_price, I can only get price property.

 

Any way to do this?

0 Likes
Ninthony
Shopify Partner
1973 296 782

I figured out a roundabout way of doing it. 

 

So you can't get the compare at price with the cart ajax, but it DOES give you a url to your product. Which you can then do another ajax call and get that product, then use it's compare at price. I put some "del" tags with unique id's next to my product prices, so that I know which one to inject the html into. 

 

So kind of like this:

 

//HTML
{% for item in cart.items %}
<div class="col-auto col-md line-item__line-price">
{{ item.price | money }} <del class="comp-price" id="comp-price_{{ item.title | handleize | replace: '®','' }}"> </del>
 </div>
{% endfor %}

//JAVASCRIPT

<script>
    let cart = jQuery.getJSON('/cart.js');
    cart.done(function(){
      cart = cart.responseJSON;
      let items = cart.items;
      getItemCompPrice(items);
    })
    function getItemCompPrice(items){
      let count=0;
      for (var i=0;i<items.length;i++){
        jQuery.getJSON(items[i].url + '.js', function(product){
          displayPrice(product.product, count)
		  count++;
        });         
        }
      }
    function displayPrice(product, index){
        console.log(product.handle)
		$('#comp-price_' + product.handle).html(product.variants[0].compare_at_price);
    }
</script>

And this is only assuming you have one variant. Definitely not perfect, but it's just what I came up with, maybe you can build off it.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
Jason
Shopify Expert
10360 158 2009

You could create an alternate cart template that outputs a json string with whatever properties you need. This would let you return cart info and the compare at price.

 

https://help.shopify.com/en/themes/customization/store/create-alternate-templates

 

If you're stuck on building something just reply and we can help nudge you in the right direction.

I jump on these forums to help and share some insights. Not looking to be hired, and not looking for work.

Don't hand out staff invites or give admin password to forum members unless absolutely needed. In most cases the help you need can be handled without that.


★ http://freakdesign.com.au ★
Ninthony
Shopify Partner
1973 296 782

@Jason , if you have time would you mind giving a simple example of this? I don't quite understand how by creating an alternate template you can output a JSON string. 

 

I know how to create alternate templates, but once the template is created how would you go about creating the JSON string you need?

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
ToTheMoon
Tourist
9 0 0

Thanks @Ninthony and @Jason for your answers!

 

@Jason I know alternate templates but how can I create a JSON to have the compare_at_price?

0 Likes
Jason
Shopify Expert
10360 158 2009

I'll make a quick example that you can use as inspiration for whatever you're building. Will post back with a link.

I jump on these forums to help and share some insights. Not looking to be hired, and not looking for work.

Don't hand out staff invites or give admin password to forum members unless absolutely needed. In most cases the help you need can be handled without that.


★ http://freakdesign.com.au ★
0 Likes
Jason
Shopify Expert
10360 158 2009

@ToTheMoon wrote:

@Jason I know alternate templates but how can I create a JSON to have the compare_at_price?


See if this helps:
https://github.com/freakdesign/Shopify-code-snippets/tree/master/Get%20a%20cart%20json%20response%20...

I jump on these forums to help and share some insights. Not looking to be hired, and not looking for work.

Don't hand out staff invites or give admin password to forum members unless absolutely needed. In most cases the help you need can be handled without that.


★ http://freakdesign.com.au ★
Ninthony
Shopify Partner
1973 296 782

Thank you! Appreciate that example.

If my solution helped you, please like it and accept it as the solution!
If you'd like to make any edits to your store, please send me a personal message and we can discuss what you'd like to accomplish :D
0 Likes
ToTheMoon
Tourist
9 0 0

Very nice @Jason ! I'll try to use it on my store. Thank you for your work!

0 Likes
thibaut_co
Tourist
4 0 0

Hello Jason, thanks for those informations. I'm trying to add the compare price on my cart but I'm not sure how to use your alternate cart template. For now, I create that alternate template with the .json code you gave but how can I use those data in my cart-template.liquid ?

0 Likes