Programmatically select dropdown option

Question

Is it possible to fire option click programmatically with pure Javascript?

HTML:

<select id="racetype" class="select-menu" name="race-type"> <option value="value" class="select-option js-select-option racetype-all" data-filter-value=".js-find-race-item">Race Types</option> <option value="value" class="select-option js-select-option racetype-sprint" data-filter-value=".js-type-sprint">Sprint</option> <option value="value" class="select-option js-select-option racetype-super" data-filter-value=".js-type-super">Super</option> <option value="value" class="select-option js-select-option racetype-beast" data-filter-value=".js-type-beast">Beast</option> </select> <a href="javascript:void(0)" onclick="SOsprint();">Click to select the second option (Sprint)</a>

JAVASCRIPT:

function SOsprint() { var select = document.getElementById("racetype"); select.selectedIndex = 1; return false; }

possible duplicate of : stackoverflow.com/questions/8140862/… — Janak
– Janak, Commented May 1, 2014 at 5:18
hi dear check this url w3schools.com/jsref/tryit.asp?filename=tryjsref_option_index — Prashant
– Prashant, Commented May 1, 2014 at 6:33

Amit Joki · Accepted Answer · 2014-05-01 05:15:21Z

You don't need [0]. getElementById() returns just a single element and not a NodeList

Do this:

var select = document.getElementById("racetype");

Satpal · Accepted Answer · 2014-05-01 05:15:30Z

There is no need to use [0] as document.getElementById returns a reference to the element by its ID not an array.

Use

 var select = document.getElementById("racetype");

instead of

var select = document.getElementById("racetype")[0];

Collectives™ on Stack Overflow

Programmatically select dropdown option

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related