CODEWITHSUNDEEP
javascript
user3329688
user3329688

Reputation: 11

How to disable a submit button after one click?

I have this form inside a div and the submit button inside another div. 

<div class="container1">
        <form name="reg-form" id="signup" action="" method="post">      
            <div class="sep"></div>
            <div class="inputs">
                <input type = "submit" id="submit" name="submitkey" value="GENERATE KEY" />
            </div>

        </form>         
    </div>

How would I disable the submit button after one click? I tried every javascript code I find but it doesn't work on me. I dont know if it is because the form is inside a div and the submit button is inside another div. Thank you.

Upvotes: 0

Views: 169

Answers (2)

Fabr&#237;cio Matt&#233;
Fabr&#237;cio Matt&#233;

Reputation: 70209

document.getElementById('signup').onsubmit = function() {
    document.getElementById('submit').disabled = true;
};

Demo

The code should be put under the script, or wrapped inside a DOMContentLoaded/window.onload handler. Make sure your HTML does not have duplicated IDs.

Also, if the button must stay disabled after a page refresh/form submission, you will need cookies or a server-side session. None of these methods are foolproof though, and this is outside of the scope of the question I believe.

Upvotes: 1

dbers
dbers

Reputation: 654

If you have jquery you can use this code:

$('#signup').submit(function(){
    $('#submit').attr('disabled', 'disabled');
});

Upvotes: 0

Related Questions