show hide form elements javascript

JavaScripts javascripts
 

JavaScript
categories

Animation
Background
Bookmarks
Buttons
Calculators
Cookies
Data handling
E-mail
Enhancements
Forms
Image rotation
Menus
Messages
Miscellaneous
Music
Password protection
Redirection
Scrollers
Tables
Time & date
Windows

Publishers

Add script
Account login

 

Home > Scripts > DHTML scripts & JavaScripts > Forms > Show / hide form elements

 

Show / hide form elements script

AUTHOR: JS-Examples
TYPE: Freeware
BROWSERS: IE 4+, IE 6+, NS 4+

This script shows how to create a form that has a portion of the form shown (or hidden) upon certain user events (radio button selection by the user in this example).


EXAMPLE

Type 1 Visible Hidden
Type 2 Visible Hidden
Type 1 Input:
Type 2 Input:


1)
Insert this script in the <HEAD>, between <HEAD> and <BODY> or in the <BODY> section of the page.

then copy (CTRL-C) & paste (CTRL-V)

2) Insert the onClick tags for the checkboxes inside your form as follows:

<form>
Visible <input name="r1" type="radio" checked value="" onClick="toggleT('divt1','s')">
Hidden <input name="r1" type="radio" value="" onClick="toggleT('divt1','h')">
</form>

copy (CTRL-C) & paste (CTRL-V)

copy (CTRL-C) & paste (CTRL-V)

3) Insert the portion of the form you wish to show/hide inside the <span> </span> as follows:

<span id="divt1" style="visibility:visible;position:relative;top:0;left:0">
<form>
....
</form>
</span>


[BACK] [TOP]

 

BLOGS - BOOKMARKS - FONTS - FRIENDS - GAMES - HEADLINES
MUSIC - PIXELS - SCRIPTS - SOFTWARE - SOUNDS - WEB SEARCH

 


Copyright © 1997-2008 SimplytheBest.net. Legal Disclaimer.
All copyrights acknowledged. All rights reserved.