Hiding a dropdown menu on load but then making it visible...

Mayoor · Jul 14, 2005

Hi guys... I need to be able to initially hide a dropdownbox on the load of a page. However there are a set of check box options and if the user clicks one of the check boxes I need the menu to appear.

Is this difficult? Can someone help me out or maybe point to some code that might do the trick?

Cheers

Mayoor

BabyJeffy · Jul 14, 2005

Using CSS (maybe even an inline style) set the drop down to be display:none and then have an onclick for the checkbox that will show the dropdown by calling a function.

Here is a simple test page showing this concept:

Code:

<html>
<head>
<title>Test</title>
<script type="text/javascript">
function myToggle() {
	document.forms['myForm'].elements['mySel'].style.display = document.forms['myForm'].elements['myChk'].checked ? 'block' : 'none';
}
</script>
</head>
<body>
<form name="myForm">
	<input type="checkbox" name="myChk" value="yes" onclick="myToggle()">Toggle Dropdown
	<br>
	<select name="mySel" style="display:none;"><option>1</option><option>2</option></select>
</form>
</body>
</html>

Hopefully you can take that code apart and make it fit into yours!

Cheers,
Jeff

[tt]Jeff's Page [/tt][tt]@[/tt][tt] Code Couch

http://www.codecouch.com/jeff/

[/tt]

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Hiding a dropdown menu on load but then making it visible...

Mayoor

Programmer

BabyJeffy

Programmer

Similar threads

Part and Inventory Search

Sponsor