Disable form submit button using javascript

Question

Basically I have a form inside a php file and I want to disable the submit button once a user clicks submit. If not my database gets spammed after multiple clicks.

I have searched stackoverflow & googled my problem and tried a lot of solutions, not working. Not sure if I am being stupid or what. After numerous trial and error still can not get the form to submit that's why I made a new thread. I have tried setting the "onsubmit" property on the submit input of the form but the form does not submit at all, just stuck. Also tried other Javascript solutions without success.

Any help would be greatly appreciated! Please do not be harsh, I have little to no experience in Javascript.

<form action="adduser.php" method="POST">
              <div class="form_attr">
                <label>Username:</label><input type="text" name="username" value="<?php if ($err_flag == true){echo htmlspecialchars($username);}?>">
                <br/>
                <label>Password:</label><input type="password" name="password" value="">
                <br/>
                <label>Firstname:</label><input type="text" name="firstname" value="<?php if ($err_flag == true){echo htmlspecialchars($firstname);}?>">
                <br/>
                <input type="checkbox" name="admin" value="1"> Admin<br/>
                <input type="checkbox" name="receptionist" value="2"> Receptionist<br/>
                <input type="checkbox" name="technician" value="4"> Technician<br/>
                <input type="submit" name="submit" value="submit">
              </div>
           </form>

stackoverflow.com/questions/6634999/…

DaCruzR
– DaCruzR

2015-12-07 20:27:08 +00:00
Commented Dec 7, 2015 at 20:27 — DaCruzR
– DaCruzR, Commented Dec 7, 2015 at 20:27

rahul · Accepted Answer · 2015-12-07 01:56:33Z

2

Something like this should help.

$(function(){
    $("input[type='submit'][name='submit']").click(function(){
        $(this).attr("disabled", "disabled");
        return true;
    });
});

Demo

answered Dec 7, 2015 at 1:56

rahul

188k50 gold badges239 silver badges266 bronze badges

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

2 Comments

DaCruzR Over a year ago

Thanks, I've tried your solution I can get the button to disable but the form doesn't post. Any ideas?

DaCruzR Over a year ago

no errors with your code, however after some searching I found a solution that works! stackoverflow.com/questions/6634999/…

inf1ux · Accepted Answer · 2015-12-07 01:54:46Z

1

<input type="submit"  onclick="this.disabled=true;" name="submit" value="submit" >

Did not test it, but it should work.

Note: This is not a good solution - someone can disable js and spam you. You need to prevent this in the backend(in php).

answered Dec 7, 2015 at 1:54

inf1ux

2831 silver badge14 bronze badges

Collectives™ on Stack Overflow

Disable form submit button using javascript

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related