By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
434,795 Members | 1,235 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 434,795 IT Pros & Developers. It's quick & easy.

Filtering or avoiding double click on form submission

P: n/a
Despite searching the net, I can't find a suitable solution that prevents a
user's double click from submitting a form twice. I'm currently using the
following in a button element:

<input type="button" onclick="this.disabled=true;this.form.submit();">

While it prevents multiple single clicks, it isn't good enough for a fast
double click, such as found on some multi-button mice.

Anyone have a better solution?

--
Ed Jay (remove 'M' to reply by email)

Win the War Against Breast Cancer.
Knowing the facts could save your life.
http://www.breastthermography.info
Oct 14 '08 #1
Share this Question
Share on Google+
14 Replies


P: n/a
On Oct 15, 12:01*am, Ed Jay wrote:
Despite searching the net, I can't find a suitable solution that preventsa
user's double click from submitting a form twice. I'm currently using the
following in a button element:
<input type="button" onclick="this.disabled=true;this.form.submit();">
While it prevents multiple single clicks, it isn't good enough for a fast
double click, such as found on some multi-button mice.
Have a look at
http://www.dynamicdrive.com/dynamici...submitonce.htm

I do not know if is fast enough for all mice,
and using cats would not be very nice.
Oct 14 '08 #2

P: n/a
Ed Jay wrote:
Despite searching the net, I can't find a suitable solution that prevents a
user's double click from submitting a form twice. I'm currently using the
following in a button element:

<input type="button" onclick="this.disabled=true;this.form.submit();">
Use a submit button and don't call this.form.submit();

<input type="button" onclick="this.disabled=true;">

This makes the form accessible when js is not enabled.

What happens when the user's connection drops after the user fills out
the form, but before pressing submit?

If you've used a wireless connection, you've no doubt run into that
problem. It's a bad effect that I remember experiencing on GG and GMail
many times.

Garrett

--
comp.lang.javascript FAQ <URL: http://jibbering.com/faq/ >
Oct 14 '08 #3

P: n/a
dhtml wrote:
Ed Jay wrote:
>Despite searching the net, I can't find a suitable solution that
prevents a
user's double click from submitting a form twice. I'm currently using the
following in a button element:

<input type="button" onclick="this.disabled=true;this.form.submit();">

Use a submit button and don't call this.form.submit();

<input type="button" onclick="this.disabled=true;">
I meant:

<input type="submit" onclick="this.disabled=true;">
This makes the form accessible when js is not enabled.

What happens when the user's connection drops after the user fills out
the form, but before pressing submit?

If you've used a wireless connection, you've no doubt run into that
problem. It's a bad effect that I remember experiencing on GG and GMail
many times.
So can be replaced with:
<input type="submit">

If you need to filter double requests on the server, put a hidden in the
form. When the token comes, you've got your request. Subsequent
submissions with that token can be ignored.

Garrett
Garrett

--
comp.lang.javascript FAQ <URL: http://jibbering.com/faq/ >
Oct 14 '08 #4

P: n/a
my*******************@googlemail.com scribed:
>On Oct 15, 12:01*am, Ed Jay wrote:
>Despite searching the net, I can't find a suitable solution that prevents a
user's double click from submitting a form twice. I'm currently using the
following in a button element:
<input type="button" onclick="this.disabled=true;this.form.submit();">
While it prevents multiple single clicks, it isn't good enough for a fast
double click, such as found on some multi-button mice.

Have a look at
http://www.dynamicdrive.com/dynamici...submitonce.htm

I do not know if is fast enough for all mice,
and using cats would not be very nice.
Thanks. Tried it, and it failed.

--
Ed Jay (remove 'M' to reply by email)

Win the War Against Breast Cancer.
Knowing the facts could save your life.
http://www.breastthermography.info
Oct 14 '08 #5

P: n/a
dhtml scribed:
>Ed Jay wrote:
>Despite searching the net, I can't find a suitable solution that prevents a
user's double click from submitting a form twice. I'm currently using the
following in a button element:

<input type="button" onclick="this.disabled=true;this.form.submit();">
Use a submit button and don't call this.form.submit();

<input type="button" onclick="this.disabled=true;">

This makes the form accessible when js is not enabled.
Not a problem with js disabled, as the user cannot access the form unless js
is enabled.
>
What happens when the user's connection drops after the user fills out
the form, but before pressing submit?

If you've used a wireless connection, you've no doubt run into that
problem. It's a bad effect that I remember experiencing on GG and GMail
many times.
Good point, in general, but this is a web app in a doctor's office, so
losing a wireless connection doesn't pose a problem.

--
Ed Jay (remove 'M' to reply by email)

Win the War Against Breast Cancer.
Knowing the facts could save your life.
http://www.breastthermography.info
Oct 15 '08 #6

P: n/a
rf

"dhtml" <dh**********@gmail.comwrote in message
news:gd**********@registered.motzarella.org...
dhtml wrote:
>Ed Jay wrote:
>>Despite searching the net, I can't find a suitable solution that
prevents a
user's double click from submitting a form twice. I'm currently using
the
following in a button element:

<input type="button" onclick="this.disabled=true;this.form.submit();">

Use a submit button and don't call this.form.submit();
If you need to filter double requests on the server, put a hidden in the
form. When the token comes, you've got your request. Subsequent
submissions with that token can be ignored.
Or cause the server side script to issue a redirect to a "thankyou" page.
This can be extended to representing (without processing) the form page when
you find invalid values.
Oct 15 '08 #7

P: n/a
Ed Jay wrote:
Despite searching the net, I can't find a suitable solution that
prevents a user's double click from submitting a form twice. I'm
currently using the following in a button element:

<input type="button" onclick="this.disabled=true;this.form.submit();">

While it prevents multiple single clicks, it isn't good enough for a
fast double click, such as found on some multi-button mice.

Anyone have a better solution?
The only and best way to ensure this isn't an issue, is coding the
script to only execute the necessary functions on the first click. All
of the logic must be done in the script, and it's always best to code
scripts to not create a problem if a user was to submit the form over
once. Things like JavaScript on the browser end probably won't hurt,
but shouldn't be relied upon. Use some custom session instead and
control what happens and anticipate the things such as a double
submission.
--
Tim Greer, CEO/Founder/CTO, BurlyHost.com, Inc.
Shared Hosting, Reseller Hosting, Dedicated & Semi-Dedicated servers
and Custom Hosting. 24/7 support, 30 day guarantee, secure servers.
Industry's most experienced staff! -- Web Hosting With Muscle!
Oct 15 '08 #8

P: n/a
dhtml scribed:
>>Despite searching the net, I can't find a suitable solution that
prevents a user's double click from submitting a form twice. I'm currently using the
following in a button element:
If you need to filter double requests on the server, put a hidden in the
form. When the token comes, you've got your request. Subsequent
submissions with that token can be ignored.
Doesn't thin presuppose that the same instance of the script is running for
both submissions?

--
Ed Jay (remove 'M' to reply by email)

Win the War Against Breast Cancer.
Knowing the facts could save your life.
http://www.breastthermography.info
Oct 15 '08 #9

P: n/a
Ed Jay wrote:
<input type="button" onclick="this.disabled=true;this.form.submit();">

While it prevents multiple single clicks, it isn't good enough for a fast
double click, such as found on some multi-button mice.

Anyone have a better solution?
Caveat: I'm a Javascript novice.

Can you change your <inputso that it does a submit from the "onclick"
handler? The code that does the submit could then ignore a second click.

In concept:

onload sets come counter to 0
onclick increments the counter, and submits the form iff counter=1
--
Steve Swift
http://www.swiftys.org.uk/swifty.html
http://www.ringers.org.uk
Oct 15 '08 #10

P: n/a
Ed Jay wrote:
dhtml scribed:
>Ed Jay wrote:
Good point, in general, but this is a web app in a doctor's office, so
losing a wireless connection doesn't pose a problem.
There are three things wrong with that statement.

1) It precludes the possibility that a doctors' office could use wifi.
2) It ignores the possibility of the connection being disconnected for
another reason.
3) It's medicine related. When the script fails, the doctor will have to
resort to some other means of performing his task.

Making the doctor rely on your web script is a bad idea.

Garrett
--
comp.lang.javascript FAQ <URL: http://jibbering.com/faq/ >
Oct 15 '08 #11

P: n/a
rf

"dhtml" <dh**********@gmail.comwrote in message
news:gd**********@registered.motzarella.org...
2) It ignores the possibility of the connection being disconnected for
another reason.
Cleaners.

Cleaners inviarably pull out and clean up that messy blue wire thingy
hanging out the back of the cupboard.
Oct 15 '08 #12

P: n/a
rf scribed:
>
"dhtml" <dh**********@gmail.comwrote in message
news:gd**********@registered.motzarella.org...
>2) It ignores the possibility of the connection being disconnected for
another reason.

Cleaners.

Cleaners inviarably pull out and clean up that messy blue wire thingy
hanging out the back of the cupboard.
You folks may well be correct. Perhaps when I've solved the issue I posted
about, I'll look into the possibility of interrupted service issues. Thanks.

--
Ed Jay (remove 'M' to reply by email)

Win the War Against Breast Cancer.
Knowing the facts could save your life.
http://www.breastthermography.info
Oct 15 '08 #13

P: n/a
dhtml wrote:
Ed Jay wrote:
>Despite searching the net, I can't find a suitable solution that
prevents a user's double click from submitting a form twice. I'm
currently using the following in a button element:

<input type="button" onclick="this.disabled=true;this.form.submit();">

Use a submit button and don't call this.form.submit();

<input type="button" onclick="this.disabled=true;">

This makes the form accessible when js is not enabled.
That is a) no submit button (type="submit" was), and b) would it make the
form unsubmittable when returning to it using the Back feature of UAs. So
much for accessibility.

The proper and oft-recommended solution is to let a server-session expire
after the submit, and to check then whether the session expired before doing
anything else.
F'up2 comp.infosystems.www.authoring.misc

PointedEars
--
Prototype.js was written by people who don't know javascript for people
who don't know javascript. People who don't know javascript are not
the best source of advice on designing systems that use javascript.
-- Richard Cornford, cljs, <f8*******************@news.demon.co.uk>
Oct 15 '08 #14

P: n/a
rf wrote:
"dhtml" wrote:
>If you need to filter double requests on the server, put a hidden in the
form. When the token comes, you've got your request. Subsequent
submissions with that token can be ignored.

Or cause the server side script to issue a redirect to a "thankyou" page.
This can be extended to representing (without processing) the form page when
you find invalid values.
Since the "thank you" "page" cannot reasonably be displayed before the
server has finished, and the user might try to submit again in the meantime,
this is no solution at all.

Please fix your From header so that it complies with Internet Standards and
Netiquette.
F'up2 c.i.w.a.m

PointedEars
--
Use any version of Microsoft Frontpage to create your site.
(This won't prevent people from viewing your source, but no one
will want to steal it.)
-- from <http://www.vortex-webdesign.com/help/hidesource.htm>
Oct 15 '08 #15

This discussion thread is closed

Replies have been disabled for this discussion.