...

View Full Version : add dropdown menus to a dropdown menu format



ImperialSpider
03-26-2005, 06:14 PM
This is going to be hard to explain, so please bear with me here...
I have no idea about how to do what I want to do, but maybe someone can help me with the code or direct me where to go to get the code...
I have a page, that has a series of dropdown menus (5). However, I am only wanting to show 3 at first. What I am looking for is a way to have the 4th and 5th dropdown menus to pop into view, or just appear after the last entry of the 3rd dropdown menu is entered. Basically, what I would like to happen is this...

User fills in the first three dropdown choices, and after filling out the last option of the 3rd dropdown, the user clicks the 'Enter' or the 'tab' key on their keyboard, a 4th dropdown menu will appear underneath the 3rd one, showing all 4 dropdown menus...and after the 4th dropdown is filled, and the user clicks on the 'Enter' or 'tab' key on their keyboard, a 5th dropdown menu will appear underneath the 4th one. showing all 5 dropdown menus.
Eventually I will be adding more than 5 dropdowns, but for now, 5 is all I need.

Can anyone help me with this?

I have put a sample page on a friends server so you can see what I have so far...
http://www.tweedscott.com/ImperialSpider.html
The code is too long to post here.

Thanks in Advance for any assistance,

Imperial Spider.

vwphillips
03-26-2005, 11:13 PM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>
<title></title>

<script language="JavaScript" type="text/javascript">
<!--

var CngAry=new Array();

function CkCng(obj){
Add=1;
for (i=0;i<CngAry.length;i++){
if (CngAry[i]==obj){
Add=0;
}
}
if (Add){
CngAry[CngAry.length]=obj;
}
if (CngAry.length>2){
document.getElementById('fred3').style.visibility='visible';;
}
if (CngAry.length>3){
document.getElementById('fred4').style.visibility='visible';;
}
}

//-->
</script>

</head>

<body>
<select name="fred0" size="1" onchange="javascript:CkCng(this);" >
<option>Select 0</option>
<option>fred0 1</option>
<option>fred0 2</option>
</select>
<br>
<select name="fred1" size="1" onchange="javascript:CkCng(this);" >
<option>Select 1</option>
<option>fred1 1</option>
<option>fred1 2</option>
</select>
<br>
<select name="fred2" size="1" onchange="javascript:CkCng(this);" >
<option>Select 2</option>
<option>fred2 1</option>
<option>fred2 2</option>
</select>
<br>
<select name="fred3" id="fred3" size="1" onchange="javascript:CkCng(this);" style="position:relative;visibility:hidden;" >
<option>Select 3</option>
<option>fred3 1</option>
<option>fred3 2</option>
</select>
<br>
<select name="fred4" id="fred4" size="1" style="position:relative;visibility:hidden;" >
<option>Select 4</option>
<option>fred4 1</option>
<option>fred4 2</option>
</select>
<br>
</body>

</html>



lots of other ways to do this



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum