disabling a button while running a function

Question

I have a function in Javascript which is called by clicking a button and it takes approximately one minute to be finished. How can I disable the button after one click and enable it again after function is finished? I need this process to prevent spamming.

I tried the following piece of code, but it is not working. It is still possible to click the button several times.

Javascript:

function myFunc()
{
    document.getElementById("Btn").disabled = true;
    \\do something for one minute
    document.getElementById("Btn").disabled = false;
}

html:

 <button type="button" id="Btn" onclick="myFunc()">Generate!</button>

I assume \\do something for one minute is some async task, hence *.disabled = false; could be placed in the callback. — Rayon
– Rayon, Commented Apr 17, 2019 at 10:18
do something for one minute <- Maybe you are doing async process? — Eddie
– Eddie, Commented Apr 17, 2019 at 10:18

ACD · Accepted Answer · 2019-04-18 01:30:34Z

1

Your code is working fine. Maybe your function runs quickly that's why it appears as you can spam.

If you're calling function thru ajax, make sure async is false (default is true)

function myFunc() {
  document.getElementById("Btn").disabled = true;
  setTimeout(function() {
    console.log('hey');
    document.getElementById("Btn").disabled = false;
  }, 1000);

}

<button type="button" id="Btn" onclick="myFunc()">Generate!</button>

edited Apr 18, 2019 at 1:30

answered Apr 17, 2019 at 10:21

ACD

1,4511 gold badge14 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

disabling a button while running a function

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related