[thelist] Seeking JS Solution for Double Form Submission????
Warden, Matt
mwarden at odyssey-design.com
Mon Jul 16 15:16:39 CDT 2001
> From: <Faust at thinkchurch.com>
> Subject: [thelist] Seeking JS Solution for Double Form Submission????
>
...
> If the key already exists, the information is pulled form
> the database and displayed to the user as if it were the first
> submission. My problem is if the database has not completely
> updated with information from various sites (Several users just
> seem to keep clicking on the form until they see something), the
> user only gets the information currently in the database. :-( How
> can I disable the submit buttons are the first submission?
There are a couple ways, actually. The best way is probably to bypass the
buttons altogether... go one step above that and use the onSubmit action of
the <form> element:
<html>
<head>
...
<script language="JavaScript" type="text/javascript">
bSubmitted = false;
function setSubmitted(value)
{
bSubmitted = value;
return;
}
function getSubmitted()
{
return bSubmitted;
}
</script>
</head>
<body>
...
<form ... onSubmit="return (!getSubmitted());">
...
<input type="submit" name="send" id="send" onClick="setSubmitted(true);">
</form>
...
</body>
</html>
The doings of it all is this line:
... onSubmit="return (!getSubmitted());"
if sSubmitted = true, then the submission button has already been clicked.
in this case, getSubmitted() will return true, so we end up with:
... onSubmit="return !true;"
And !true = false, so it's the same as saying:
... onSubmit="return false;"
Now, the problem comes when someone submits the first time by hitting
'enter' on their keyboard and then either hits enter again or clicks the
button. So, a better solution might be to take the onClick out of the submit
button and put it in the function called by onSubmit:
<script language="JavaScript" type="text/javascript">
bSubmitted = false;
function setSubmitted(value)
{
bSubmitted = value;
return;
}
function getSubmitted()
{
var bOldValue = bSubmitted;
setSubmitted(true);
return bOldValue;
}
</script>
...
<form ... onSubmit="return (!getSubmitted());">
...
<input type="submit" name="send" id="send">
</form>
...
Of course, this will only work when the browser/client has JavaScript
enabled. I think a server-side solution of sorts would be required if you
wanted to get this working for 100% of your users. The stats I've collected
from www.synchrony.net say 78% of *our* audience have JavaScript enabled
(well, more accurately, they have javascript enabled and support: new
Image(), which is what I'm using to collect this data), just to give you an
idea.
HTH,
--
mattwarden
mattwarden.com
More information about the thelist
mailing list