Greying out Submit button!

how?

[dreamcatcher]

If I want a "Submit" button to be greyed out after it is clicked, how do I go about that using javascript?

Thank you!

:)

[Reflection]

I think all you have to do is set it to disabled, could be wrong though :).

Something along the lines of buttonname.disabled = true;

[ricfink]

In IE you change the property of the submit button object to true. You can use an onclick event to trigger it or onsubmit.
There may be another way, but I'm not aware of it.

document.form_1.btnname.disabled = true;

don't know for sure offhand about Moz, or Opera.

[DrDoc]

It works basically the same way in all modern browsers that support JavaScript.

It's really a cool effect. However, if you're using this to prevent a form being submitted twice it's not necessarily a good idea. Sure, it's a good complement to other functions... but it shouldn't be the only thing you rely on.

[dreamcatcher]

It's really a cool effect. However, if you're using this to prevent a form being submitted twice it's not necessarily a good idea. Sure, it's a good complement to other functions... but it shouldn't be the only thing you rely on.

Yes it was so a form couldn`t be submitted twice. I`ve coded a guestbook and I wanted to grey the "Sign" button out after it was clicked. I think it would prove useful, so I`ll try some of the ideas listed.

Thanks for the information!

:)

[WebDevInfo]

Here you go:

<script>
function submitonce(theform){
//if IE 4+ or NS 6+
if (document.all ¦¦ document.getElementById){
//screen thru every element in the form, and hunt down "submit"
for (i = 0; i < theform.length; i++) {
var tempobj = theform.elements[i]
if(tempobj.type.toLowerCase() == "submit")
//disable em
tempobj.disabled = true
}
}
}
</script>

[dreamcatcher]

Wow, thanks WebDevInfo. Thats excellent!

:)

[ricfink]

Another way I have used to prevent a double submission is with stylesheets, making the form disappear and replaced by a message saying the form was already filled out and submitted.
I won't go into that in detail here, but setting the display property for the submit button to none might serve just as well as greying it out.