Change ATC button to "Adding Product..." onClick before Submit is triggered

Hi Everyone

I’m wanting to for the text on the Add-to-Cart button to change after it has been clicked. However, I need it to change before it triggers the Submit function. I’m currently using Symmetry 2.0.

I wrote this below and dropped it into the theme.liquid file, it works fine but it fires after the Submit function. So, there is a delay in the text changing while it’s adding the product to the cart.

The reason is that I have an app that takes a few seconds for the submission to run, so I want the text to change first so people don’t think the site has frozen. They’ll then just wait the 2 seconds and it will redirect them to the cart page.

Does anyone know what I need to do in order to make this work?

Thanks in advance!

Thomas

const chnbtn2 = document.getElementById('changebutton2');

chnbtn2.addEventListener('click', function handleClick() {
const initialText = 'Add to Cart';
chnbtn2.innerHTML = `Adding Product ...`;
return true;

});

Hi @Thomas71 ,

Please send your site and if your site is password protected, please send me the password. I will check it.