Weired Problem: Currency Selector JS Adds Variant to Cart When Clicked on

Solved
Highlighted
Tourist
6 0 0

I've been following this tutorial to add a currency selector with js to my site header(debut theme).

Everything works fine until I find whenever I click on one of the variants in a product page, it gets automaticly added to the shopping cart, and the page also redirects to the shopping cart.

Weird huh?

Try choosing one of the sizes in this product and see: https://www.decorsmarket.com/collections/frontpage/products/watercolor-jungle-sloth-kids-cartoon-gre...

the site is: https://decorsmarket.com

I don't know JS but this piece of code seems to be pretty straight forward, I don't know what is causing the problem. Any suggestions other than using an app?

 

function currencyFormSubmit(event) {
    event.target.form.submit();
  }

  document.querySelectorAll('.shopify-currency-form select').forEach(function() {
    this.addEventListener('change', currencyFormSubmit);
  });

 

 

0 Likes
Highlighted
Shopify Partner
370 44 75

This is an accepted solution.

Hi,
Actually code is adding changeListner in all elements(try to type something in search as well and click outside).
So it needs to target only currency selector. Use this code instead 

document.querySelectorAll('.shopify-currency-form select').forEach(function(e) {
    e.addEventListener('change', currencyFormSubmit);
  });
If helpful then please Like and Accept Solution.
Email: suhagiyajivan1992@gmail.com
Skype: jivan.suhagiya
Give a try to Shopify APP: https://apps.shopify.com/checkout-reminder
1 Like
Highlighted
Tourist
6 0 0

Thank you @Jivan_Suhagiya! Problem solved! Guess I'll have to learn JS eventually. XD

0 Likes
Highlighted
Tourist
6 0 0

btw, the tutorial here is a valid and fairly easy way to solve the problem "adding currency selector in shopify" or "moving currency selector from footer to header in debut theme" as of Oct 21,2020. So I'm leaving these words as a reply so others with the same problem may see it.

https://shopify.dev/tutorials/customize-theme-support-multiple-currencies

just follow the tutorial, and remember if something weird happens to your site like the JS did to mine, see the code @Jivan_Suhagiya provided.

0 Likes