Stop submit button being pressed twice

JavaScript
1

I am trying to stop a submit button being pressed more than once. I have tried the following code but it stops the form being submitted at all :frowning: What I could do with is an “afterclick” event :slight_smile:

(function() {
  var send = document.getElementById("send");
  send.addEventListener("click", function() {
    send.disabled = true;
  });
})();
2

How about setting the disabled attribute of the HTML element instead?

1 Like
3

Are you referring to the parent element, Paul? In this case the div

<div class="field">
  <input name="send" id="send" type="submit" value="Send">
</div>
4

Pardon, I mistakenly thought that the disabled property might do something different from the disabled attribute. They both achieve the same thing.

Instead of disabling the send button from the click event, disable it from the submit event instead.

1 Like
5

Der, that’ll be my “afterclick” event then! Thanks.

6

I should say that it’s usually a more reliable design decision to be capable of withstanding doubleclicks, because many things can interfere with JavaScript running on someones browser.

A typical solution for example is to scan the database for submissions that occur from the same source within 5 seconds of each other, and remove the latter one.

1 Like
7

Good point. I was looking at this more as an enhancement.

1 Like
8

Perhaps an event listener to the on submit call to set the button attribute to disabled? Paul’s solution is more robust and can cause less side effects however.

Sorry didnt see that was suggested, I blame lack of coffee for improper response reading.

3 Likes
9

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.