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

Solved
decorsmarketcom
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
Jivan_Suhagiya
Shopify Partner
494 68 102

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
First kind of Checkout Reminder APP: https://apps.shopify.com/checkout-reminder
decorsmarketcom
Tourist
6 0 0

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

0 Likes
decorsmarketcom
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
noob1
Tourist
8 0 1

this code just deactivated the currency selector i have in my left hand corner of my store

0 Likes
Gosia
Tourist
4 0 0

@Jivan_Suhagiya love you for this solution, i was soo confused when inputs and selects stops working, i spend few day on this, finnaly i catch this code i insert from tutorial, and menage that it cause problems, but had no idea how to fix it, thank you   

0 Likes
Jivan_Suhagiya
Shopify Partner
494 68 102

Hi @Gosia 
still are you looking for solution?
Please share more details with store link so I can review and provide you solution.

If helpful then please Like and Accept Solution.
Email: suhagiyajivan1992@gmail.com
Skype: jivan.suhagiya
First kind of Checkout Reminder APP: https://apps.shopify.com/checkout-reminder
0 Likes
Gosia
Tourist
4 0 0

@Jivan_Suhagiya no i'm just thanking you for fixing this function Good job

0 Likes