How: Select a value in a drop down via Javascript

M

M.Siler

If I know the value of a drop down list, not the text that shows in the
list, but the value. How can I make that item selected in the drop down
using Javascript?
 
S

Steve Easton

Try this.

<form>
<p align="center"><b>Select a site </b>
<select id="Choice" style="color: #0000FF" size="1" name="mySelect">
<option value="">Select one</option>
<option value="http://altavista.com">AltaVista</option>
<option value="http://www.yahoo.com">Yahoo</option>
<option value="http://www.google.com">Google</option></select>
<input type="button" value="Go"
onclick="window.open(Choice.options[Choice.selectedIndex].value)">
</p></form>



Note that this uses a Go button. This is needed for people who
navigate with the keyboard and not the mouse, because otherwise they'll
never get past the first item in the drop down list.


Also this has the text set to blue. If you don't want Blue remove:
style="color: #0000FF"
or change it to the color of your choice.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer
 
M

M.Siler

Steve -

If I were to set the Yahoo line to read

<option value="http://www.yahoo.com" selected>Yahoo</option>

when the page loads it would show Yahoo in the drop down. If I was to put
the code back to as you posted it, without selected in that line, how could
I, via Javascript, set it to where it looks the same as if I had used the
selected key word.

I have a page where I know the value of an element in a drop down list,
which could change depeneding on what the user does before this page, so I
have to run through the values of the drop down until I find a match, that I
know how to do, but once I find the match how to I set it "selected"?

Thanks,
Mark

Steve Easton said:
Try this.

<form>
<p align="center"><b>Select a site </b>
<select id="Choice" style="color: #0000FF" size="1" name="mySelect">
<option value="">Select one</option>
<option value="http://altavista.com">AltaVista</option>
<option value="http://www.yahoo.com">Yahoo</option>
<option value="http://www.google.com">Google</option></select>
<input type="button" value="Go"
onclick="window.open(Choice.options[Choice.selectedIndex].value)">
</p></form>



Note that this uses a Go button. This is needed for people who
navigate with the keyboard and not the mouse, because otherwise they'll
never get past the first item in the drop down list.


Also this has the text set to blue. If you don't want Blue remove:
style="color: #0000FF"
or change it to the color of your choice.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
.......................with a computer



M.Siler said:
If I know the value of a drop down list, not the text that shows in the
list, but the value. How can I make that item selected in the drop down
using Javascript?
 
N

Nigel Hill

A jump menu is not what they were asking for.

The question seems to be:
How do you change the selection of a drop down list by using javascript, in
the same way that applying
document.getElementById('sb_keyword').value='Hello'; to a button would change
a text field?

Steve Easton said:
Try this.

<form>
<p align="center"><b>Select a site </b>
<select id="Choice" style="color: #0000FF" size="1" name="mySelect">
<option value="">Select one</option>
<option value="http://altavista.com">AltaVista</option>
<option value="http://www.yahoo.com">Yahoo</option>
<option value="http://www.google.com">Google</option></select>
<input type="button" value="Go"
onclick="window.open(Choice.options[Choice.selectedIndex].value)">
</p></form>



Note that this uses a Go button. This is needed for people who
navigate with the keyboard and not the mouse, because otherwise they'll
never get past the first item in the drop down list.


Also this has the text set to blue. If you don't want Blue remove:
style="color: #0000FF"
or change it to the color of your choice.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer



M.Siler said:
If I know the value of a drop down list, not the text that shows in the
list, but the value. How can I make that item selected in the drop down
using Javascript?
 
T

Thomas A. Rowe

It can be done using server-side scripting when the values are populated from a database.

--
==============================================
Thomas A. Rowe (Microsoft MVP - FrontPage)
==============================================
If you feel your current issue is a results of installing
a Service Pack or security update, please contact
Microsoft Product Support Services:
http://support.microsoft.com
If the problem can be shown to have been caused by a
security update, then there is usually no charge for the call.
==============================================

Nigel Hill said:
A jump menu is not what they were asking for.

The question seems to be:
How do you change the selection of a drop down list by using javascript, in
the same way that applying
document.getElementById('sb_keyword').value='Hello'; to a button would change
a text field?

Steve Easton said:
Try this.

<form>
<p align="center"><b>Select a site </b>
<select id="Choice" style="color: #0000FF" size="1" name="mySelect">
<option value="">Select one</option>
<option value="http://altavista.com">AltaVista</option>
<option value="http://www.yahoo.com">Yahoo</option>
<option value="http://www.google.com">Google</option></select>
<input type="button" value="Go"
onclick="window.open(Choice.options[Choice.selectedIndex].value)">
</p></form>



Note that this uses a Go button. This is needed for people who
navigate with the keyboard and not the mouse, because otherwise they'll
never get past the first item in the drop down list.


Also this has the text set to blue. If you don't want Blue remove:
style="color: #0000FF"
or change it to the color of your choice.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer



M.Siler said:
If I know the value of a drop down list, not the text that shows in the
list, but the value. How can I make that item selected in the drop down
using Javascript?
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top