473,396 Members | 2,036 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,396 software developers and data experts.

Disabling Buttons?

How can I disable a button once it has been clicked? I want to prevent
the user from clicking on it twice if they have a slow connection.

Thanks...

Jul 20 '05 #1
16 2023
Ralph Freshour wrote:
How can I disable a button once it has been clicked? I want to prevent
the user from clicking on it twice if they have a slow connection.

Thanks...


<input type="button" value="Please click me" class="button"
onclick="return singleClick(this, 'Please wait...');" />
<script type="text/javascript">
function singleClick(b, s) {

// move focus off the button
b.blur();

// has the button already been clicked?
if (typeof b.isClicked != "undefined" && b.isClicked) {
// yes, disallow the action
return false;
} else {
// no, flag that it has been clicked
b.isClicked = true;

// should we change the button text?
if (typeof s != "undefined") {

// yes, is there support to set the width of a button?
if (typeof b.style != "undefined" &&
typeof b.style.width != "undefined" &&
typeof b.offsetWidth != "undefined") {

// yes, set the width to the current width
b.style.width = b.offsetWidth + "px";
}

// change the text on the button
b.value = s;

// is there support to set the CSS class of a button?
if (typeof b.className != "undefined") {
// yes, set the CSS class to "buttonDisabled"
// (defined in css)
b.className = "buttonDisabled";
}
}

// allow the action
return true;
}
}
</script>

One important point with this code, the "Please wait..." text you pass to
the button *must* be shorter then the current text. Making it longer would
significantly complicate the procedure. Alternatively, you could dispose
of changing the text and the className entirely, since it's all just
cosmetic.

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...ce/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...ence_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html
Jul 20 '05 #2

"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:3F**************@agricoreunited.com...
Ralph Freshour wrote:
How can I disable a button once it has been clicked? I want to prevent
the user from clicking on it twice if they have a slow connection.

Thanks...


<input type="button" value="Please click me" class="button">
... snip ...


Or:

<html>

<body>
<form id="MyForm" ACTION="http://example.microsoft.com/sample.asp"
METHOD="POST">
<input type="submit" value="Press Me"
onclick="this.disabled=true;document.all.MyForm.su bmit();">
</input>
<form>
</body>

</html>

Regards,
Chris.
Jul 20 '05 #3
@SM
Chris a ecrit :

"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:3F**************@agricoreunited.com...
Ralph Freshour wrote:

onclick="this.disabled=true;document.all.MyForm.su bmit();">


beuark ! that's for IE ! ( and others what do they do ? )
Jul 20 '05 #4
@SM
Ralph Freshour a ecrit :

How can I disable a button once it has been clicked? I want to prevent
the user from clicking on it twice if they have a slow connection.


What kind of button ?

a radio or checkbox

<input type=radio onclick="if(this.checked) this.disabled;">

a button

<input type=button value="Go On"
onclick="if(this.value=='Go On')
{function1(); function2(); this.value='Disabled';}
">
Jul 20 '05 #5
Chris wrote:
"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:3F**************@agricoreunited.com...
Ralph Freshour wrote:
How can I disable a button once it has been clicked? I want to prevent
the user from clicking on it twice if they have a slow connection.

Thanks...


<input type="button" value="Please click me" class="button">
... snip ...


Or:

<html>

<body>
<form id="MyForm" ACTION="http://example.microsoft.com/sample.asp"
METHOD="POST">
<input type="submit" value="Press Me"
onclick="this.disabled=true;document.all.MyForm.su bmit();">
</input>
<form>
</body>

</html>

Regards,
Chris.


It's not properly formed HTML (there is no closing </input> tag and it should
be </form>, not <form>), but I'll assume those were typos (although I really
hope you don't write forms with opening and closing <input></input> tag sets).

As for the JavaScript on the page, well, in Mozilla Firebird (and other Gecko
based browsers), it generates the following error and fails to prevent a
second click on the button: Error: document.all has no properties

In Netscape 4.78 it generates the following error and fails to prevent a
second click on the button: document.all has no properties

It also fails to provide any sort of feedback mechanism to the user as to
*why* the button is no longer working (although that isn't as important as the
next point) and it will not submit the form at all if client-side JavaScript
is disabled.

So, before you unceremoniously ...snip... a working solution and replace it
with your own, perhaps you should ensure that your solution works as well in
as many browsers, does as much, and provides the desired functionality even if
the user chooses to disable client-side JavaScript.

There is more to JavaScript authoring then having the script work in one, or
even many, browsers. Part of being a good JavaScript programmer is ensuring
that whatever you are doing degrades gracefully and provides as much support
for as many people as possible. Even in an Intranet environment, this should
be the goal, because although your company runs Internet Explorer today, they
may not always run it, and having a solution that can be ported to other
browsers more readily will, ultimately, make your job easier.

Besides, providing the sort of "solution" you just provided means you've just
trained another JavaScript author to be sloppy, careless and care little for
the portion of their audience not using the tools you expect them to be using
(Internet Explorer with client-side JavaScript enabled).

My guess is it was getting lonely in the Sloppy, Careless and Care Little Club
and you wanted some new members.

--
| Grant Wagner <gw*****@agricoreunited.com>

* Client-side Javascript and Netscape 4 DOM Reference available at:
*
http://devedge.netscape.com/library/...ce/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/a...ence_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-deve...upgrade_2.html
Jul 20 '05 #6
"@SM" <st**************@wanadoo.fr> writes:
Chris a ecrit :

"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:3F**************@agricoreunited.com...
> Ralph Freshour wrote:
>

onclick="this.disabled=true;document.all.MyForm.su bmit();">


beuark ! that's for IE ! ( and others what do they do ? )


onclick="this.disabled=true;this.form.submit();"

I'd do that in IE too.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
Jul 20 '05 #7

"@SM" <st**************@wanadoo.fr> wrote in message
news:3F***************@wanadoo.fr...
Chris a ecrit :

"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:3F**************@agricoreunited.com...
Ralph Freshour wrote:

onclick="this.disabled=true;document.all.MyForm.su bmit();">


beuark ! that's for IE ! ( and others what do they do ? )


Stephane,

I ran a very simple test of this on IE 6.0 and NN7.0 (so I assume Mozilla
will work as well).
In what respect do you think this may cause a problem.

Regards,
Chris.
p.s. beuark is spelt burk in English.
You can also be abusive in French if you wish as I speak that too.
In fact you can be abusive in Russian if you like.
I don't speak Russian, but it will make no difference.
Jul 20 '05 #8
On Wed, 17 Dec 2003 22:22:32 +0000, Chris wrote:

"@SM" <st**************@wanadoo.fr> wrote in message

<snip>
> > Ralph Freshour wrote:
> >
> onclick="this.disabled=true;document.all.MyForm.su bmit();">


beuark ! that's for IE ! ( and others what do they do ? )


Stephane,

I ran a very simple test of this on IE 6.0 and NN7.0 (so I assume
Mozilla will work as well).
In what respect do you think this may cause a problem.


I was having trouble with the old HTML button double-click on a PHP script
that does a very large query (in excess of five minutes to process).

I use the 'onclick="this.disabled=true;..." method for IE and Mozilla and
it works fine in both.

--
i.m.
The USA Patriot Act is the most unpatriotic act in American history.

Jul 20 '05 #9
Chris hu kiteb:

Regards,
Chris.
p.s. beuark is spelt burk in English.


I love Skitt's Law.

Berk.

--
--
Fabian
Visit my website often and for long periods!
http://www.lajzar.co.uk

Jul 20 '05 #10
You are better off having a hidden variable with the value of a timestamp.

Then look in the database and see if you've already created a record
for the transaction.

Ralph Freshour <ra***@primemail.com> wrote in message news:<ft********************************@4ax.com>. ..
How can I disable a button once it has been clicked? I want to prevent
the user from clicking on it twice if they have a slow connection.

Thanks...

Jul 20 '05 #11

"Grant Wagner" <gw*****@agricoreunited.com> wrote in message
news:3F***************@agricoreunited.com...
Chris wrote:
"Grant Wagner" <gw*****@agricoreunited.com> wrote

.... snip ...

Hi Grant,

I was not intending to replace your posting, which was already available to
the questioner.
He asked how to disable a button and I noticed you had failed to mention the
'disabled' property of the submit button.
I see you noticed a couple of typos in the HTML I put in as a working
example.
I'm sure these corrections will be useful to the questioner should he decide
to make use of the suggestions I offered ;-)

Regards,
Chris.
Jul 20 '05 #12
"Chris" <c_********@btconnect.com> writes:
> onclick="this.disabled=true;document.all.MyForm.su bmit();">
I ran a very simple test of this on IE 6.0 and NN7.0 (so I assume Mozilla
will work as well).
In what respect do you think this may cause a problem.


In that "document.all" is undefined in Mozilla/Netscape. That means
that the above gives rise to a Javascript error.

It might work anyway, but that is just because the form's normal
behavior takes over (you clicked the submit button, so the form
is submitted).

I would say that it's living on the edge to disable the submit button
between it being clicked and the form being submitted. It works, but
it could just as well have not worked. I would not depend on it.

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
Jul 20 '05 #13
@SM
Chris a ecrit :

"@SM" <st**************@wanadoo.fr> wrote in message
news:3F***************@wanadoo.fr...
Chris a ecrit :

onclick="this.disabled=true;document.all.MyForm.su bmit();">
beuark ! that's for IE ! ( and others what do they do ? )


onclick="this.disabled=true; this.submit();"
onclick="this.disabled=true; document.forms['MyForm'].submit();"
onclick="this.disabled=true; document.forms[0].submit();"

Stephane,

I ran a very simple test of this on IE 6.0 and NN7.0 (so I assume Mozilla
will work as well).
*document.all* is IE language

it is possible some others browsers could speak fiew IE idioms

to be sure, it's preferable to use universal language (Ecma ?)
In what respect do you think this may cause a problem.
*document.all* will give an error on my favorite browser for instance
Regards,
Chris.
p.s. beuark is spelt burk in English.
perhaps
but I did mean that I said (in french) beeeeeaaarrrrrck
It doesn't appear to me that burk (in english) would sound the same.
Could you spel this sound in english to me ?
You can also be abusive in French if you wish as I speak that too. So could you give me a translation (this above sentance)?
My english is not too goog. In fact you can be abusive in Russian if you like.
I don't speak Russian, but it will make no difference.


Regards
Stéphane
Jul 20 '05 #14
Chris wrote on 17 Dec 2003 at Wed, 17 Dec 2003 22:22:32 GMT:
"@SM" <st**************@wanadoo.fr> wrote in message
news:3F***************@wanadoo.fr...
Chris a ecrit :
>
> "Grant Wagner" <gw*****@agricoreunited.com> wrote in message
> news:3F**************@agricoreunited.com...
> > Ralph Freshour wrote:
> >
> onclick="this.disabled=true;document.all.MyForm.su bmit();"


beuark ! that's for IE ! ( and others what do they do ? )


In what respect do you think this may cause a problem.


The collection, document.all, is a proprietary Microsoft feature.
Not all browsers support it. For those that don't, all that code
above will do is prevent the user from *ever* submitting the form
unless they discover that they can disable JavaScript.

Mike

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk")
Jul 20 '05 #15
JRS: In article <br**********@sparta.btinternet.com>, seen in
news:comp.lang.javascript, Chris <c_********@btconnect.com> posted at
Wed, 17 Dec 2003 22:22:32 :-

"@SM" <st**************@wanadoo.fr> wrote in message
news:3F***************@wanadoo.fr...
beuark ! that's for IE ! ( and others what do they do ? )

p.s. beuark is spelt burk in English.


The OP evidently intended to represent a vulgar noise, descriptive of
the code shown by Ralph, and not a real English word.

But please do not make spelling corrections in a language that you
yourself cannot spell properly.

The proper English spellings are berk and burke, and not burk; the
former is a simple insult of vulgar derivation, and the second means,
roughly, cheat, being derived from a proper name.
Page js-date5.htm has lost its final "eval".

--
© John Stockton, Surrey, UK. ??*@merlyn.demon.co.uk Turnpike v4.00 MIME. ©
Web <URL:http://www.merlyn.demon.co.uk/> - FAQish topics, acronyms, & links.
Check boilerplate spelling -- error is a public sign of incompetence.
Never fully trust an article from a poster who gives no full real name.
Jul 20 '05 #16
On Thu, 18 Dec 2003 01:38:37 +0100, "@SM"
<st**************@wanadoo.fr> wrote:
Chris a ecrit :

"@SM" <st**************@wanadoo.fr> wrote in message
news:3F***************@wanadoo.fr...
> Chris a ecrit :
> >
> > onclick="this.disabled=true;document.all.MyForm.su bmit();">
>
> beuark ! that's for IE ! ( and others what do they do ? )

onclick="this.disabled=true; this.submit();"
onclick="this.disabled=true; document.forms['MyForm'].submit();"
onclick="this.disabled=true; document.forms[0].submit();"


No reason to call submit at all, in fact it may be bad unless you also
cancel the default behaviour of the submit button, when you click a
submit button the form is going to be submitted unless you cancel the
event.

Also the this.disabled approach may result in your input submit
elements name/value pair not being sent with the submission.

this.disabled=true is all you need surely?
to be sure, it's preferable to use universal language (Ecma ?)


Generally it's preferable to use what works in the widest possible
situations with the lowest possible risk it shouldn't matter who
convened the meeting that chose it, but yeah all your solutions were
better than the simple .all solution suggested.

Jim.
--
comp.lang.javascript FAQ - http://jibbering.com/faq/

Jul 20 '05 #17

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
by: Philippe Meunier | last post by:
Hi, I am using the .NET toolbar with VB.NET 2003. My toolbar uses icons images that are actually PNG files and uses alpha blending on it. So to make alpha blending work correctly with the...
3
by: Jo | last post by:
Hi I've got a .NET web application and once a user presses a certain button the the page I'd like to disable other buttons straight away so that the user can't press anything else while...
1
by: Chris | last post by:
Hi Can you disable particular radiobuttons in a radibuttonlist control? I know you can disable the entire radiobutton list, but I'm interested in disabling radio buttons within the...
5
by: Lyn | last post by:
Hi, I hope someone can help. I have a main form which mostly fills the Access window. In the bottom half of this form I have a tab control to display various types of data related to the main...
1
by: markeboy | last post by:
What is the workaround to prevent toolbar buttons from displaying a grey square where the image should be once the toolbar button is disabled I have transparent color of the image list set to...
1
by: Lamine Darbouche | last post by:
Please Help, I have a form with multiple buttons "New User", "Delete User", "Save" buttons, when I access the form it selects the "New User" button by default, so when you hit the return key...
2
by: dougawells | last post by:
Hi- I'm wanting to have a set of radio buttons disabled when a form is displayed, then if they check another specific radio button, those would become enabled. I've tried setting it via...
0
by: Carlo \(MCP only\) | last post by:
Hi all I'm trying to disable (or remove/hide) the three small buttons that appears on the RIGHT edge of a MDIparent menu bar when a contained MDIchild form is maximized. Please note that I'm...
20
by: Geoff Cox | last post by:
Hello, I am not at clear how to tackle this one. Say the note middle C is played, just once. Then when the user clicks on a play image a series of notes are played starting with middle C...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.