Dropdown Menu

[SteveJo]

Hi,
I have a menu that lets me select from multiple options, and I want that any option that I choose will lead me to another website, after that I click the submit button.
How I do this?

Code: Select all

<form action="" method="post">

<select name="Dropdown Menu" id="menu">
<option selected>Select</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

<input type="submit" value="" id="button">
</form>


Thanks,
Steve

[HotNoob]

so basically you want the drop down list to act sort of like links?

Code: Select all

<script>
function goToSelected()
{
window.location = document.getElementById('menu').value;
}
</script>
<select name="Dropdown Menu" id="menu">
<option selected>Select</option>
<option value="http://SomeUrl.1">1</option>
<option value="http://SomeUrl.2">2</option>
<option value="http://SomeUrl.3">3</option>
</select>

<input type="submit" value="Go To" id="button" onClick="goToSelected();">

that should do it i think...
i don't use the select tags very often tho.

[SteveJo]

Thanks.

I created the menu, but now I have a problem with the design.

I set an image as the background of the menu, but the text does not appear in the middle (it appears in the center but in the top, since the height is bigger than the font size).
Here is a screenshot:
http://www.mypicx.com/11162010/screenshot/

Here is the code in the Stylesheet:

Code: Select all

}
#menu {
   padding: 0px 0px 0px 0px;
   margin: 140px 0px 0px 93px;
   width: 222px; height: 34px;
   text-align: center;
   font: 14px Ariel;
   background: no-repeat url(images/type.jpg);
   border: 0px;


Here is the code in the Header:

Code: Select all

<form name="jump">
<select name="menu" id="menu">
<option selected>Select an option</option>
<option value="http://www.site1.com/">option1</option>
<option value="http://www.site2.com/">option2</option>
<option value="http://www.site3.com/">option3</option>
<option value="http://www.site4.com/">option4</option>
</select>
<input type="button" onClick="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="" id="button">
</form>


Thanks
Steve

[SteveJo]

I have used this site to create the menu and the submit button:

http://javascript.internet.com/generato ... -menu.html

(I chose the option "Use button")

My question is how do I center the text so that the text will be in the center of the box and not as it is now:
http://www.mypicx.com/11162010/screenshot/

Thank you,
Steve

[Nimble]

The code below is 1 html page and one .js page. In the html page there are two drop down menus. For the first drop down you can select either 1, 2, 3, or 4.. For the second drop down you can select 1, 2, 3 or 4, however, if you select 2 for the first drop down and then try to select 2 for the second drop down box you get an error because the javascript does not let you choose the same value twice. Another example if you select 4 for the first drop down you will not get an error if you select either 1, 2, or 3, however if you select 4 you get an error message saying sorry pick another value and you are forced to select something else. So now here is the problem.. The code works fine, I tested it and everything works perfect. Here is where I need help.. I want to move one of the drop down menus to another page so that there is one drop down on p1.html and the other on p2.html... When I try to do it the javascript does not work and the drop down on p1.html does not affect the drop down on p2.html. I want it so that on p1.html if you select a value, you get an error on p2.html if you pick the same value. Can anyone help me out??