Programmatically select an item from the drop-down list.

Question

I have a drop down menu:

<select> <option value="1">1</option> <option value="2">2</option> </select>

How can I select item 2 programmatically?

+7

CrazyCoder Mar 05 '11 at 18:59

source share

6 answers

If you're talking about pre-selecting an item, just set the item as “selected” as follows:

 <select> <option value="1">1</option> <option value="2" selected="selected">2</option> </select>

+4

John parker Mar 05 '11 at 19:04

source share

If you use plain HTML:

 <option selected value="2">2</option>

If you can use jQuery, use the val() method:

 <select id="foo"> //give it an id $("#foo").val("2");

+4

p.campbell Mar 05 '11 at 19:05

source share

 <select> <option value="1">1</option> <option value="2" selected>2</option> </select>

+1

Tom m Mar 05 '11 at 19:04

source share

jQuery edition ...

  $('#your_select').val('2');

+1

Orbit Mar 05 '11 at 19:04

source share

The simplest solution:

 <select> <option value="1">1</option> <option selected value="2">2</option> </select>

0

Florin Frătică Mar 05 '11 at 20:17

source share

jpsimons · Accepted Answer · 2011-03-05T19:04:19+0000

First, take a handle that you choose somehow:

 var select = document.getElementsByTagName("SELECT")[0];

Then manipulate the selectedIndex property (I believe this is a zero-based index):

 select.selectedIndex = 1;