View Full Version : Simple javascript help needed

12-05-2010, 12:30 AM
I have a page with options, and I need to hide options unless a certain choice is selected.

So say you have a select box for male and female, if they select male, I need it to show male options, and if they select female, it shows female options.

How can I hide things until selected and then show the textboxes and stuff?

Thank you! :thumbsup:

12-05-2010, 12:50 AM
Try searching on Google for "javascript show and hide" as there is loads of codes out there which do this.

12-05-2010, 01:13 AM
Thanks, I didn't know the name to look for.

12-05-2010, 01:28 AM
I just looked at at least a dozen websites about it, and none were helpful. Like click a text link to hide or show, or hide all check boxes, but couldn't find the one I need.

12-05-2010, 02:01 AM
Can you modify this to your needs? ...

Edited link: http://javascript.internet.com/forms/multi-value-drop-down-list.html

If not, describe problem further please. :)

12-05-2010, 03:34 AM
That is an image map. So wouldn't work.

What I am talking about is a select box with options, lets say nothing else is displayed on the page.

You click it and choose an option, and then it shows a bunch of options after clicking an option on the select box.

So like


//Hidden (value male) shown if selected male
Sex: Male
Name: <input type="text" name="malename">
<input type="submit" name="submit" value="Submit Info">

//Hidden (value female) shown if selected female
Sex: Female
Name: <input type="text" name="femalename">
<input type="submit" name="submit" value="Submit Info">

12-05-2010, 04:00 AM
Sorry ... posted incorrect link. (Working on too many projects at the same time :( )

See corrected link in post #5 above. :D

Quick example of usage below...

<title>Male / Female Information</title>
<script type="text/javascript">
// From: http://www.codingforums.com/showthread.php?p=1023768#post1023768

function ShowReg(op) {
switch (op) {
case 1 : document.getElementById('Male').style.display="block"; break;
case 2 : document.getElementById('Female').style.display="block"; break;
default : break;

<select id="choice" onChange="ShowReg(this.selectedIndex)">
<option value='0'>Choose</option>
<option value="1">Male</option>
<option value="2">Female</option>
<div id="Male" style="display:none">
Male: <input type="text" id="maleInfo" value="">
<div id="Female" style="display:none">
Female: <input type="text" id="femaleInfo" value="">

12-05-2010, 04:21 PM
Seems to be working so far, thank you!

12-05-2010, 06:03 PM
Seems to be working so far, thank you!

What do you expect to go wrong?????

Anyway, you're most welcome.
Happy to help.
Good Luck!

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum