PDA

View Full Version : Disabling Submit button after click

bostjank
01-22-2003, 09:50 AM
Hi!

I have a form with a questionnaire. Many times it happens that a user clicks the SUbmit button more than once
Here is my question: how can I disable SUbmit button once it was clicked?

Thanks,
Bostjan
Borgtex
01-22-2003, 12:34 PM
use
onclick="this.disabled = true;"

you also can use the same instruction in a function
whammy
01-23-2003, 01:16 AM
<html>
<head>
<title>asdf</title>
<script type="text/javascript">
<!--
function openYahoo() {
submitted = true;
window.open("http://www.yahoo.com");
}
// -->
</script>
</head>
<body>
<form id="submitonce" action="javascript:openYahoo()" method="get">
<input type="submit" value="Submit" onclick="if(submitted)this.disabled = true" />
</form>
</body>
</html>
CGameProgrammer
01-23-2003, 04:02 AM
You can also use a <input type="button"> instead of "type = submit" and have its onclick be a call to a JavaScript function. The function sets the button's onclick to "" and calls TheForm.submit(). Hey, it's useful for certain things.
Borgtex
01-23-2003, 04:31 AM
Whammy: onclick is executed before submit, so your script will produce an error, because you're referring to a still undefined variable. It doesn't returns false also, so the the form will be still submited

Ah!, and the browser can't understand the embarrasment smile ;)
bostjank
01-23-2003, 09:19 AM
Hi!

I have tried

onclick="this.disabled = true;"

but nothing was submitted. Then I altered this a bit:


<form name="fTest" action="page.asp" onsubmit="document.fTest.cmdSubmitt.disabled=true;">
...

It even works fine if I use BACK button to go back from page.asp (which processes information) to page with the form - then the submit button is automatically enabled.

Thanks,
Bostjan
whammy
01-23-2003, 07:34 PM
He was right - the code I posted works, but not if someone submits with the enter button... this seems to work in all cases though:


<html>
<head>
<title>asdf</title>
<script type="text/javascript">
<!--
var submitted = 0;
function submitOnce() {
if(!submitted) {
submitted ++;
return true;
}
else {
return false;
}
}
// -->
</script>
</head>
<body>
<form id="submitonce" action="submitonce.htm" method="get" onsubmit="return submitOnce()">
<input type="text" name="asdf" value="" /><br />
<input type="submit" name="submitbutton" value="Submit" />
</form>
</body>
</html>