MartinCMS
asked on
How to disable a image button
How to disable a image button so that it can't be hit twice in quick succession to submit a form.
Let say I have the following three buttons:
<TR>
<TD align="CENTER"><A href="Transactions_Main_Se lect.cfm">
<IMG src="Images/btn_charge_dec lined.gif" border="0"></A></TD>
<TD align="CENTER"><A href="Open_Activities_Sele ct.cfm">
<IMG src="Images/btn_open_activ ities.gif" border="0"></A></TD>
<TD align="CENTER"><A href="Packing_Slip_Progres s_Report.c fm">
<IMG src="Images/btn_packing_sl ip_progres s_report.g if" border="0"></A></TD>
</TR>
If it was a submit button in a form, I can do the following to disable it, BUT.....
<form name="form1">
<input type="text" name="txtbox" value="Dummy">
<input type="Submit" name="SubmitButton"
onClick="form1.SubmitButto n.disabled =true;">
</form>
Thank you.
Let say I have the following three buttons:
<TR>
<TD align="CENTER"><A href="Transactions_Main_Se
<IMG src="Images/btn_charge_dec
<TD align="CENTER"><A href="Open_Activities_Sele
<IMG src="Images/btn_open_activ
<TD align="CENTER"><A href="Packing_Slip_Progres
<IMG src="Images/btn_packing_sl
</TR>
If it was a submit button in a form, I can do the following to disable it, BUT.....
<form name="form1">
<input type="text" name="txtbox" value="Dummy">
<input type="Submit" name="SubmitButton"
onClick="form1.SubmitButto
</form>
Thank you.
ASKER
Hi @justinbillig,
I've both way and none are working. I click to button once and quickly click it again. The system log my click both time.
I've both way and none are working. I click to button once and quickly click it again. The system log my click both time.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Hi @dakyd, that's exactly what I want! Good effort @justinbillig.
Thank you both!
Thank you both!
dakyd i was never good at assigning functions to event handlers
is it new function( ) or just function( )
is it new function( ) or just function( )
Well, actually, there are two ways to do it, which is probably part of the confusion:
1) obj.onclick = function() {alert("hello world");};
2) obj.onclick = new Function("alert('hello')") ;
I prefer the first method because it looks a lot like functions you already know how to define, you just leave out the function's name (though you can also name the function if you really want to).
The second method actually creates a Function object which you can call. The constructor takes a comma delimited list of parameters followed by a string containing the function's body. In this case, we have no parameters, so we only need the function body as a string. But say you need a parameter, you'd do something like this:
increment = new Function("x", "return (x +1);");
You can now call increment as you would any other user-defined function; it takes a number and returns 1 plus that number.
I found this link a while ago, it might help explain what I'm talking about: http://www.permadi.com/tutorial/jsFunc/ As always, hope that helps.
1) obj.onclick = function() {alert("hello world");};
2) obj.onclick = new Function("alert('hello')")
I prefer the first method because it looks a lot like functions you already know how to define, you just leave out the function's name (though you can also name the function if you really want to).
The second method actually creates a Function object which you can call. The constructor takes a comma delimited list of parameters followed by a string containing the function's body. In this case, we have no parameters, so we only need the function body as a string. But say you need a parameter, you'd do something like this:
increment = new Function("x", "return (x +1);");
You can now call increment as you would any other user-defined function; it takes a number and returns 1 plus that number.
I found this link a while ago, it might help explain what I'm talking about: http://www.permadi.com/tutorial/jsFunc/ As always, hope that helps.
<TD align="CENTER"><A href="Packing_Slip_Progres
<IMG src="Images/btn_packing_sl
</TR>
or
<TD align="CENTER"><A href="Packing_Slip_Progres
<IMG src="Images/btn_packing_sl
</TR>