disabling submit button once clicked

  • Nem
  • Guru
  • Guru
  • No Avatar
  • Joined: Feb 13, 2004
  • Posts: 1240
  • Loc: UK
  • Status: Offline

Post July 30th, 2004, 6:54 am

how can i disable the submit button once clicked?!
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post July 30th, 2004, 6:54 am

  • RichB
  • Guru
  • Guru
  • User avatar
  • Joined: May 17, 2003
  • Posts: 1121
  • Loc: Boston
  • Status: Offline

Post July 30th, 2004, 8:57 am

Maybe something like this:

Code: [ Download ] [ Select ]
<input type="submit" onclick="this.disabled=true" />


or if you want to give an indication that it's processing maybe:

Code: [ Download ] [ Select ]
<input type="submit" onclick="this.disabled=true;this.value='processing'" />
Free Programming Resources
  • Nem
  • Guru
  • Guru
  • No Avatar
  • Joined: Feb 13, 2004
  • Posts: 1240
  • Loc: UK
  • Status: Offline

Post July 30th, 2004, 12:40 pm

It does work, but not when i add the rest of my code in for some reason.
GSDomains.com -Click here - Packages starting from £3.69 a month. 1.5GB Space & 10GB Bandwidth.
  • Nem
  • Guru
  • Guru
  • No Avatar
  • Joined: Feb 13, 2004
  • Posts: 1240
  • Loc: UK
  • Status: Offline

Post July 30th, 2004, 12:43 pm

I mean, it does work but it does not actual process....
GSDomains.com -Click here - Packages starting from £3.69 a month. 1.5GB Space & 10GB Bandwidth.
  • RichB
  • Guru
  • Guru
  • User avatar
  • Joined: May 17, 2003
  • Posts: 1121
  • Loc: Boston
  • Status: Offline

Post July 30th, 2004, 1:53 pm

I tested it in FireFox and didn't think to test it in IE until just now. It wouldn't work in IE until I added another line:

Code: [ Download ] [ Select ]
<input type="submit" onclick="this.disabled=true;this.value='processing';this.form.submit();" />


Hopefully, that'll do it.
Free Programming Resources
  • Nem
  • Guru
  • Guru
  • No Avatar
  • Joined: Feb 13, 2004
  • Posts: 1240
  • Loc: UK
  • Status: Offline

Post July 30th, 2004, 1:57 pm

nah, still no luck

http://dhost.info/gmforum/rethink/admin/login.php
  • RichB
  • Guru
  • Guru
  • User avatar
  • Joined: May 17, 2003
  • Posts: 1121
  • Loc: Boston
  • Status: Offline

Post July 30th, 2004, 2:07 pm

Maybe try moving this.form.submit to the front:

Code: [ Download ] [ Select ]
<input type="submit" onclick="this.form.submit();this.disabled=true;this.value='processing'" />
Free Programming Resources
  • Nem
  • Guru
  • Guru
  • No Avatar
  • Joined: Feb 13, 2004
  • Posts: 1240
  • Loc: UK
  • Status: Offline

Post July 30th, 2004, 2:10 pm

it will now process the form, but not disable it.

:|
GSDomains.com -Click here - Packages starting from £3.69 a month. 1.5GB Space & 10GB Bandwidth.
  • RichB
  • Guru
  • Guru
  • User avatar
  • Joined: May 17, 2003
  • Posts: 1121
  • Loc: Boston
  • Status: Offline

Post July 30th, 2004, 2:27 pm

Hmm, while perhaps trying it from a function onsubmit would work. You could try removing the onclick entirely and adding this function insided the <head> tag:

Code: [ Download ] [ Select ]
<script type="text/javascript">
function disable(f) {
    var button = f.elements['submit'];
    button.value = "processing";
    button.disabled=true;
    return true;    
}
</script>
  1. <script type="text/javascript">
  2. function disable(f) {
  3.     var button = f.elements['submit'];
  4.     button.value = "processing";
  5.     button.disabled=true;
  6.     return true;    
  7. }
  8. </script>


and then add this to the form tag:

Code: [ Download ] [ Select ]
onsubmit="disable(this)"
Free Programming Resources
  • Nem
  • Guru
  • Guru
  • No Avatar
  • Joined: Feb 13, 2004
  • Posts: 1240
  • Loc: UK
  • Status: Offline

Post July 30th, 2004, 2:30 pm

no luck

*weeps*
GSDomains.com -Click here - Packages starting from £3.69 a month. 1.5GB Space & 10GB Bandwidth.
  • RichB
  • Guru
  • Guru
  • User avatar
  • Joined: May 17, 2003
  • Posts: 1121
  • Loc: Boston
  • Status: Offline

Post July 30th, 2004, 2:36 pm

Do me a favor and try this link and see if it works for you. It's the same method that I just posted - it should just echo some nonsense after the form is submitted (a hidden field just for testing) but see if the disabling works for you because it seems to be working for me.

http://www.gotrivia.com/2.html
Free Programming Resources
  • joebert
  • Weathered
  • Genius
  • User avatar
  • Joined: Feb 10, 2004
  • Posts: 11817
  • Loc: Clearwater, FL
  • Status: Offline

Post July 30th, 2004, 6:21 pm

Works for me RichB, IE6 :)

*tiptoes away slowly as not to step on any toes :P *
Why yes, yes I am.
  • Cafu
  • Student
  • Student
  • No Avatar
  • Joined: Jul 15, 2004
  • Posts: 97
  • Status: Offline

Post July 30th, 2004, 11:48 pm

Works here in IE6 and Netscape 7.1
  • Nem
  • Guru
  • Guru
  • No Avatar
  • Joined: Feb 13, 2004
  • Posts: 1240
  • Loc: UK
  • Status: Offline

Post July 31st, 2004, 2:58 am

works for me too *confused*.
GSDomains.com -Click here - Packages starting from £3.69 a month. 1.5GB Space & 10GB Bandwidth.
  • Nem
  • Guru
  • Guru
  • No Avatar
  • Joined: Feb 13, 2004
  • Posts: 1240
  • Loc: UK
  • Status: Offline

Post July 31st, 2004, 3:06 am

Here is some snippets of my code:

PHP Code: [ Download ] [ Select ]
 
$header = "<!DOCTYPE HTML PUBLIC  -//W3C//DTD HTML 4.01 Transitional//EN >
 
<html>
 
<head>
 
<title>Test</title>
 
<meta http-equiv=Content-Type content=text/html; charset=iso-8859-1>
 
<script type=text/javascript>
 
function disable(f) {
 
   var button = f.elements['submit'];
 
   button.value = 'processing';
 
   button.disabled = 'true';
 
   return true;  
 
}
 
</script>
 
 
 
</head>
 
 
 
<body leftmargin=0 topmargin=0 marginwidth=0 marginheight=0>
 
<div align=center>
 
<table width=100% height=100% border=0 cellpadding=0 cellspacing=0>
 
   <tr>
 
 
  1.  
  2. $header = "<!DOCTYPE HTML PUBLIC  -//W3C//DTD HTML 4.01 Transitional//EN >
  3.  
  4. <html>
  5.  
  6. <head>
  7.  
  8. <title>Test</title>
  9.  
  10. <meta http-equiv=Content-Type content=text/html; charset=iso-8859-1>
  11.  
  12. <script type=text/javascript>
  13.  
  14. function disable(f) {
  15.  
  16.    var button = f.elements['submit'];
  17.  
  18.    button.value = 'processing';
  19.  
  20.    button.disabled = 'true';
  21.  
  22.    return true;  
  23.  
  24. }
  25.  
  26. </script>
  27.  
  28.  
  29.  
  30. </head>
  31.  
  32.  
  33.  
  34. <body leftmargin=0 topmargin=0 marginwidth=0 marginheight=0>
  35.  
  36. <div align=center>
  37.  
  38. <table width=100% height=100% border=0 cellpadding=0 cellspacing=0>
  39.  
  40.    <tr>
  41.  
  42.  


Then my form:

Code: [ Download ] [ Select ]
<form method='post' action='<? $PHP_SELF ?>' onsubmit='disable(this)'>
        <table width=75% border=0 cellpadding='0' cellspacing='0' bgcolor='#D4D0C8'>
         <tr>
          <td align=center> <table width='100%' border='0' cellpadding='0' cellspacing='0' bordercolor='#000000'>
            <tr bordercolor='#000000' bgcolor='#D4D0C8' >
             <td colspan='2'> <div align='center'><strong><font size='2' color='#FF0000' face='Verdana, Arial, Helvetica, sans-serif'>
       <? echo $uerror
            ?> </font></strong></div></td>
            </tr>
         <tr bordercolor=#000000 bgcolor=#D4D0C8 >
             <td colspan=2>&nbsp;</td>
            </tr>
            <tr bordercolor=#000000 bgcolor=#D4D0C8 >
             <td width=42%><font size=2 face=Verdana, Arial, Helvetica, sans-serif>Username</font></td>
             <td width=58%><input name='username' type=text size=25 style="border-style: solid; border-width: 1px 1px 1px 1px" /></td>
            </tr>
            <tr bordercolor=#000000 bgcolor=#D4D0C8>
             <td><font size=2 face='Verdana, Arial, Helvetica, sans-serif'>Password</font></td>
             <td> <input name='password' type='text' size='25' style="border-style: solid; border-width: 1px 1px 1px 1px" /></td>
            </tr>
            <tr align='center' valign='middle' bordercolor='#000000' bgcolor='#D4D0C8'>
             <td colspan='2'>&nbsp; </td>
            </tr>
            <tr align='center' valign='middle' bordercolor='#000000' bgcolor='#D4D0C8'>
             <td colspan='2'><input type='submit' name='submit' value='Login' style="border-style: solid; border-width: 1px 1px 1px 1px; font-style: strong" /></td>
            </tr>
           </table></form>
  1. <form method='post' action='<? $PHP_SELF ?>' onsubmit='disable(this)'>
  2.         <table width=75% border=0 cellpadding='0' cellspacing='0' bgcolor='#D4D0C8'>
  3.          <tr>
  4.           <td align=center> <table width='100%' border='0' cellpadding='0' cellspacing='0' bordercolor='#000000'>
  5.             <tr bordercolor='#000000' bgcolor='#D4D0C8' >
  6.              <td colspan='2'> <div align='center'><strong><font size='2' color='#FF0000' face='Verdana, Arial, Helvetica, sans-serif'>
  7.        <? echo $uerror
  8.             ?> </font></strong></div></td>
  9.             </tr>
  10.          <tr bordercolor=#000000 bgcolor=#D4D0C8 >
  11.              <td colspan=2>&nbsp;</td>
  12.             </tr>
  13.             <tr bordercolor=#000000 bgcolor=#D4D0C8 >
  14.              <td width=42%><font size=2 face=Verdana, Arial, Helvetica, sans-serif>Username</font></td>
  15.              <td width=58%><input name='username' type=text size=25 style="border-style: solid; border-width: 1px 1px 1px 1px" /></td>
  16.             </tr>
  17.             <tr bordercolor=#000000 bgcolor=#D4D0C8>
  18.              <td><font size=2 face='Verdana, Arial, Helvetica, sans-serif'>Password</font></td>
  19.              <td> <input name='password' type='text' size='25' style="border-style: solid; border-width: 1px 1px 1px 1px" /></td>
  20.             </tr>
  21.             <tr align='center' valign='middle' bordercolor='#000000' bgcolor='#D4D0C8'>
  22.              <td colspan='2'>&nbsp; </td>
  23.             </tr>
  24.             <tr align='center' valign='middle' bordercolor='#000000' bgcolor='#D4D0C8'>
  25.              <td colspan='2'><input type='submit' name='submit' value='Login' style="border-style: solid; border-width: 1px 1px 1px 1px; font-style: strong" /></td>
  26.             </tr>
  27.            </table></form>
GSDomains.com -Click here - Packages starting from £3.69 a month. 1.5GB Space & 10GB Bandwidth.
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post July 31st, 2004, 3:06 am

Post Information

  • Total Posts in this topic: 16 posts
  • Users browsing this forum: No registered users and 222 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© Unmelted Enterprises 1998-2009. Driven by phpBB © 2001-2009 phpBB Group.