How can I fix a code error on my contact page?

Technical Q&A
1

Hi,

I used the following code in the theme.js file to move my currency converter from the header to the footer:

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

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

It works perfectly for updating the currency converter, but it also creates a bug on my Contact page where I get an error message when I place the cursor in the ‘email’ field ('email is invalid).

shelleyd_0-1642638640018.png
shelleyd_0-1642638640018.png1147×576 24.5 KB

How do I amend the code to stop this from happening?

My store is https://onyx-and-elm.myshopify.com/admin , password aulick and I’m using the Debut theme.

1 Like
2

Hi @shelleyd ,

Please change code:

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

=>

document.querySelectorAll('.shopify-currency-form select').forEach(
  element => element.addEventListener('change', this.currencyFormSubmit.bind(this))
);

Hope it helps!

3

Did you solve this problem now?

4

It worked! Thanks so much! It took me a long time to find the code that was causing this problem. I’m really grateful.

5

@LitExtension

The reCAPTCHA doesn’t seem to be working now on this page despite being enabled. Would the new code have affected this?

6

Hi @shelleyd ,

It doesn’t affect, this code only helps to check the submit form of currency. With your previous code, when change any input or similar HTML tag, it will automatically submit the form even though it’s not currency form.

Hope it is clear to you.

1 Like