Money filter on shopify not working on scripts

Question

Hi. So for some reason, I'm trying to subtract my variant prices. It's working but the money filter isnt.

console.log ( {{ product.variants[0].price | minus: product.variants[1].price }} );

80604

The number above is what I'm being able to get. Adding | money filter to the code returns nothing. For example:

console.log ( {{ product.variants[0].price | minus: product.variants[1].price | money }} );

Any workaround I can do please? Thanks!

Answer 1

Simply adding the money filter to that command will give a rendered code that looks something like this:

console.log( $806.04 )

This is not legal Javascript, and you will probably be seeing an error in your console relating to this line.

Fortunately, Shopify has the json filter, which is good for more than just converting Liquid objects to JavaScript Object Notation. Any Liquid variable that is passed through this filter will be converted to a javascript-legal form. This means that text will be wrapped in quotation marks, any special characters will be properly escaped, blank values will become null , etc. I strongly recommend that developers ALWAYS use the json filter whenever you need to pass variables from Liquid to Javascript.

So to fix your code, simply use:

console.log ( {{ product.variants[0].price | minus: product.variants[1].price | money | json }} );