Form buttons that disable once clicked

A nice feature

[PFOnline]

Hi all, this is kind of hard to explain, but I'll try my best...

I'm trying to figure out how to make a form button become "disabled" or "greyed out" once it has been clicked once...

So there's no possible way customers can submit there order more than once, resulting in double credit card payments.

Anyone know how to do it?

Thanks :)

[RonPK]

I don't know a way to disable a submit button, but you can easily hide it with a bit of JavaScript:

<script type="text/javascript">
function hideMe() {
if (document.getElementById) {
document.getElementById("myButton").style.visibility = "hidden";
}
return true;
}
</script>
<input type="submit" id="myButton" onClick="return hideMe()" value="OK">

This should work in IE5+ and recent versions of Mozilla and Opera. With some adaptations you can even get it to work in IE4 and Netscape 4.

[RonPK]

Here's a different approach:

<script type="text/javascript">
var clicked = false;
function disableMe() {
 if (document.getElementById) {
 if (!clicked) {
 document.getElementById("myButton").value = "thank you";
 clicked = true;
 return true;
 } else {
 return false;
 }
 } else {
 return true;
 }
}
</script>
<input type="submit" id="myButton" onClick="return disableMe()" value="OK">

On the second click the script returns false, which should prevent the form from being submitted again.

[Visit Thailand]

Isn't this the exact same as this thread : [webmasterworld.com...]

The code Toadhall gave you works fine I have tested it myself.

[Marketing Guy]

The snitz forum site has that feature when you submit a post (you submit, the submit button graphic changes and is disabled).

I don't think it's part of the forum software, but im sure if you ask in the community forum someone will tell you how its done.

Scott :)

[DrDoc]

Or, you can do this:

onclick="this.disabled=true"

Or,

onmouseup="this.disabled=true" onkeyup="this.disabled=true"

[DrDoc]

Note that all these ideas require JavaScript. Relying on these functions as your only "protection" is not a good idea. Sure, they are good to have, but you need something server-side to check for duplicate posts...