Two dropdown menus on a page using Javascript

They have: 488 posts

Joined: Feb 2000

Hi,

How do you setup 2 Javascript dropdown menus for a page? With one script it works okay but when I add another one, it just hangs and don't work for both. Any ideas?

The example script is below:

<script language="JavaScript">

</script>

COUNTRY
Australia
California
Chile
France
Italy
Spain
South Africa

Any help is appreciated. Thanks

Abhishek Reddy's picture

He has: 3,348 posts

Joined: Jul 2001

I assume you're repeating the same code for each dropbox?
Then the problem is that there are two dropboxes with the same name.

Probably the simplest way to do it is to change the names of the dropboxes and repeat the code for each.

&lt;script language="JavaScript"&gt;
<!-- go to j-scripts.com
function goThere() {
if (document.jumpBox.theBox[document.jumpBox.theBox.selectedIndex].value != "") {
location = document.jumpBox.theBox[document.jumpBox.theBox.selectedIndex].value
}
}

function goThere2() {
if (document.jumpBox.theBox2[document.jumpBox.theBox2.selectedIndex].value != "") {
location = document.jumpBox.theBox2[document.jumpBox.theBox2.selectedIndex].value
}
}
//-->
&lt;/script&gt;
<form name="jumpBox">
<select name="theBox" size="1" onChange="goThere()">
<option value="" selected>COUNTRY</option>
<option value="aust.htm">Australia</option>
<option value="califor.htm">California</option>
<option value="chile.htm">Chile</option>
<option value="fran.htm">France</option>
<option value="italy.htm">Italy</option>
<option value="spain.htm">Spain</option>
<option value="africa.htm">South Africa</option>
</select>

<select name="theBox2" size="1" onChange="goThere2()">
<option value="" selected>COUNTRY</option>
<option value="aust.htm">Australia</option>
<option value="califor.htm">California</option>
<option value="chile.htm">Chile</option>
<option value="fran.htm">France</option>
<option value="italy.htm">Italy</option>
<option value="spain.htm">Spain</option>
<option value="africa.htm">South Africa</option>
</select>
</form>
'

I've changed the name of the second dropbox to theBox2 and it's function to goThere2.

I hope this helps.

They have: 488 posts

Joined: Feb 2000

Sorry I forgot to mentioned, I did changed the script name so as not to have script conflict with each other but it still doesn't work. Not sure if it's allowed to use 2 scripts on a page, anyone tried it? Anyways, thanks Abhishek Reddy

They have: 488 posts

Joined: Feb 2000

Wow! Thanks a lot Abhishek Reddy. I tried again and the script works great.

Vincent Puglia's picture

They have: 634 posts

Joined: Dec 1999

Hi NSS,

You might be interested in the "Select & Go" script/tutorial at my site (GrassBlade)

Vinny

They have: 488 posts

Joined: Feb 2000

Hi Vinny,

Thanks a lot, you sure have some very good tutorials on menus and types. I bookmarked your site.

Regards

Vincent Puglia's picture

They have: 634 posts

Joined: Dec 1999

Hi NSS,

You're welcome Laughing out loud

Vinny

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.