Help needed: currency switcher code triggers 'add to cart' when selecting product variants

Highlighted
New Member
1 0 0

Hi! I'm new to Shopify theme development. I've added a currency switcher to the header of our store (which uses the Debut theme) following Shopify's instructions at https://shopify.dev/tutorials/customize-theme-support-multiple-currencies. It uses JavaScript to trigger the currency change. Unfortunately, while the currency switcher works, it also impacts the product variant selection. Each time I select a size, the product is immediately added to the cart and I'm sent to the cart. It seems like the currency selector code somehow triggers the "Add to cart" button when a size is selected, and I cannot figure out why. Any help would be very much appreciated!

This is the code used to add the switcher:

<div class="site-header__icon">{% form 'currency' %}
            <select name="currency">
              {% for currency in shop.enabled_currencies %}
              {% if currency == cart.currency %}
              <option selected="true">{{currency.iso_code}} {{currency.symbol}}</option>
              {% else %}
              <option>{{currency.iso_code}}</option>
              {% endif %}
              {% endfor %}
            </select>
            {% endform %}
          </div>

 

 ...and this is the Javascript&colon;

/* Currency switcher */
function currencyFormSubmit(event) {
    event.target.form.submit();
  }

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

 

The issue can be seen here (store password is btm2020): https://blacktee.rocks/collections/black-tee-merch-fall-2020/products/black-tee-circle-mens-t-shirt 

THANK YOU!

0 Likes