Uncle Jim's JavaScript Examples
Form Properties

This example displays how to set up your form properties and event buttons. The form itself must be named, as do the fields in the form. The name of this form is "TheForm". The name of the field is "FieldOne".


Setting Up The Form:
Be sure to *name* both the
and the fields in it, as shown below. Note how these names are used in the doReset() function in the script above.
The class="TAS" is used to attach the style (see above) to the textarea fields. This is optional.




Setting Up The Images:

The individual functions are attached by means of the <a href> ... </a> tags surrounding the images. See the explanations of the switchImage(), doReset(), and doSubmit() functions above. Note that the html shown below is in open format for sake of clarity in this demo. You may tighten up the code in your page per usual. This will remove any leading / trailing spaces around the images. In order for this to work correctly, you *must* properly *name* the images, as shown in the code below.


<a href="javascript:doReset()"
   onMouseOut  = "switchImage('resetImage',0)"
   onMouseOver = "switchImage('resetImage',1)"
   onMouseDown = "switchImage('resetImage',2)">
<img name="resetImage"
   src="images/reset_green.gif"
   width="83"
   height="30"
   border="0">
</a>
<a href="javascript:doSubmit()"
   onMouseOut  = "switchImage('submitImage',3)"
   onMouseOver = "switchImage('submitImage',4)"
   onMouseDown = "switchImage('submitImage',5)">
<img name="submitImage" src="images/submit_green.gif"
   width="83"
   height="30"
   border="0">
</a>

The results look like this:



Close This Window