Disable button while AJAX is working

  • bruceleebee

    (@bennygill)


    7 years, 1 month ago

    How do I disable a button (or hide it) while AJAX is working?

    I added a second “Checkout” button to my WooCommerce shopping cart page like this:

    <a href="https://elementpaints.com/checkout/">Proceed to Secure Checkout</a>

    But I want to disable that button while AJAX is being processed on the page. AJAX is used to update the cart totals when the quantity is changed.

    Does anyone know how I can implement this? I assume it will be some sort of JavaScript code

    I’m good with hacking code together, but not great at writing my own.

    Here is the website I am trying to do this on: https://elementpaints.com/cart/

    • This topic was modified 7 years, 1 month ago by bruceleebee.
Viewing 1 replies (of 1 total)
  • Moderator bcworkz

    (@bcworkz)

    7 years, 1 month ago

    Since the “button” is actually a link, it cannot be disabled like form fields can. However, JS could change the href attribute to an empty string so that clicking the link merely reloads the same page. CSS styling can be changed so the button appears to be “disabled”. If any onclick events are attached to the link, they can be removed. So while it cannot be “disabled” per se, it can be rendered inoperative.

Viewing 1 replies (of 1 total)
  • The topic ‘Disable button while AJAX is working’ is closed to new replies.