SageFix. LetsFix!  
Current Location : Home > Web Development > JavaScript > Reset button submitting form instead of clearing boxes Share/Save/Bookmark    

Main Menu
SageFix - Let's Fix

Board Categories
    Web Site Designing
- Graphics
    Web Development
- .NET
- Classic ASP
- JavaScript
- PHP
    WebSite Management
- Promotion Techniques
- Search Engine Optimization
    Databases
- MySQL

Tutorials

Database Connection Strings

  Contact Us


 1 - 10 of 10 [Total 1 Pages]  
Reset button submitting form instead of clearing boxes      Jul 26, 2002, 10:46 1
  
I was using images as the submit and reset buttons on a form, I got the submit button working, but the reset button won't work it just submits the form, this is the code:
<input type="image" src="clear.gif" name="reset" onClick="java script:document.Login.reset()">
and the form code is:
<FORM METHOD=POST ACTION="logme.php" name="Login">
Does anyone know how to make it work like a normal reset button?
Thanks!

 
      Jul 30, 2002, 04:00 2
  
Thanks all, I had to leave this problem to the side for a while 'cos I had a bigger problem, still not solved!
I got it working with this:
Code:
<input type="image" src="weblogos/log_in.gif" name="submit" onClick="javascript:document.Login.submit()">	&nbsp&nbsp&nbsp&nbsp	<img src="weblogos/clear.gif" alt="" onclick="document.Login.reset();" />
It clears the form fine, and the other submit button still works fine!
Thanks for you help!

 
      Jul 26, 2002, 11:01 3
  
Try this instead:

<input type="image" src="clear.gif" name="reset" onClick="javascript:document.Login.reset()">


JavaScript is one word not two.

 
      Jul 26, 2002, 14:29 4
  
Sorry I forgot to say, I had tried that too! I've just changed it that many times that I forgot to change it back to javascript (one word)
You see what it does is clears the boxes but then it submits the form, and if I've just put in an incorrect username and I want to clear it, I click clear and the boxes ar cleared, but then it loads the logme.php that says: Invalid User Name.
Can it not just clear the form?

 
      Jul 26, 2002, 16:12 5
  
I think you need to post more code. I use this javascript on many of my forms and have never had a problem.

 
      Jul 28, 2002, 11:43 6
  
This is the whole page it's just a login page with 2 input boxes and a login and reset button. The reset button clears the form, but then tries to log in as well?
Code:
<HTML><HEAD><TITLE>Login in to XYZPrint</TITLE><TABLE WIDTH="100%" border=0><TD WIDTH=62 VALIGN=BOTTOM><IMG SRC="XYZPrint1.png"></TD><TD VALIGN=BOTTOM WIDTH=250><FONT FACE="COMIC SANS MS" SIZE=6>User Login</FONT></TD><TD ALIGN=RIGHT>	<TABLE bgcolor=#F0E68C ALIGN=RIGHT>	<TD BGCOLOR="F0E68C" ALIGN=CENTER><FONT FACE="COMIC SANS MS" SIZE=1>	If you have authority to modify  	<BR>or add data please login here:	</FONT></TD>	<TR>	<TD BGCOLOR="F0E68C" ALIGN=CENTER><FONT FACE="COMIC SANS MS" SIZE=1>	<A HREF="/XYZPrint/Admin/admin_menu.php">Administrator</A>	</FONT></TD>	</TR>	<TR>	<TD BGCOLOR="F0E68C" ALIGN=CENTER><FONT FACE="COMIC SANS MS" SIZE=1>	<A HREF="/XYZPrint/SuperUser/suser_menu.php">Super User</A>	</FONT></TD>	</TR>	</TABLE></TABLE></HEAD><FORM METHOD=POST ACTION="logme.php" name="Login"><BODY><BR><BR><TABLE WIDTH="100%" BORDER=0 ALIGN=CENTER CELLSPACING=0 CELLPADDING=5><TR><TD ALIGN=CENTER COLSPAN=2 BGCOLOR="D3D3D3"><FONT FACE="COMIC SANS MS" SIZE=3>Please login using your User Name and the Password provided during registration.</FONT></TD></TR><TR>	<TD COLSPAN=2>&nbsp</TD></TR><TR><TD ROWSPAN=6></TD><TD><B><FONT FACE="COMIC SANS MS" SIZE=2>User Name :</FONT></B></TD></TR><TR><TD><INPUT TYPE=text SIZE=15 NAME="username"></TD></TR><TR><TD WIDTH="57%"><B><FONT FACE="COMIC SANS MS" SIZE=2>Password :</FONT></B></TD></TR><TR><TD><INPUT TYPE=password SIZE=15 NAME="password"></TD></TR><TR>	<TD>&nbsp</TD></TR><TR>	<TD>	<input type="image" src="weblogos/log_in.gif" name="submit" onClick="javascript:document.Login.submit()">	&nbsp&nbsp&nbsp&nbsp	<input type="image" src="weblogos/clear.gif" name="reset" onClick="javascript:document.Login.reset()">	</TD></TR></TABLE><BR><BR><BR><TABLE WIDTH="100%"><TR>	<TD ALIGN=CENTER VALIGN=BOTTOM>	<a href="user_entername.html"><IMG BORDER="0" SRC="weblogos/change_password.gif"></a>	<FONT FACE="COMIC SANS MS" SIZE=1><BR>If you cannot remember your password,	<BR>click to change it.</FONT>	</TD>	<TD ALIGN=CENTER VALIGN=BOTTOM>	<a href="Registration.html"><IMG BORDER="0" SRC="weblogos/register.gif"></a>	<FONT FACE="COMIC SANS MS" SIZE=1><BR>Click if you haven't registered yet.<BR>&nbsp</FONT>	</TD></TR></TABLE></FORM></BODY></HTML>
??? Anyone?

 
      Jul 28, 2002, 14:29 7
  
Navelly, the problem arises because an input element with type="image" has the action submit assigned to it. To get around that, simply do this:
Code:
Change:<input type="image" src="weblogos/clear.gif" name="reset" onClick="java script:document.Login.reset()">To:<img src="weblogos/clear.gif" alt="" onclick="document.Login.reset();" />

 
      Jul 29, 2002, 16:17 8
  
There is a much better way to handle this then what is mentioned above
Code:
<input type="image" src="clear.gif" alt="Reset" onClick="this.form.reset(); return false;" /><input type="image" src="send.gif" alt="Submit" />
By using true INPUT type=image objects for the images instead of regular IMAGE objects we gain the power of using 'this', which removes the necessity of hard-coding the form's DOM name into the onClick() event. (this.form references the form the input is located in) Remember, portable code = better code.

By simply adding 'return false();' to the onClick() event for the reset button, we cancel it's default action, which is to submit the form.

 
      Jul 29, 2002, 16:33 9
  
I thought there was a downfall to this method, but I can't think what it was, i think it was something to do with referencing the object or sumting like that

 
      Jul 29, 2002, 16:54 10
  
Quote:

I thought there was a downfall to this method, but I can't think what it was, i think it was something to do with referencing the object or sumting like that
If there is, post it here when you find it becuase I haven't the slightest what that is.

 
 1 - 10 of 10 [Total 1 Pages]  









Subscribe to our mailing list
email


Current Location : Home > Web Development > JavaScript > Reset button submitting form instead of clearing boxes Share/Save/Bookmark    

Development problem? SageFix is completely free -- paid for by advertisers and donations. Click here to Contact Us If you have any query. Enjoy!
Request processed in 7.0E-5 seconds Home - Contact Us - Terms Of Service - Privacy Policy - Copyrights - Top
Advertisements do not imply our endorsement of that product or service.
Current server time now is 18-Mar-2010 06:26:34
Copyright © 2009 Sagefix Inc. All rights reserved.
Powered By SageFix