Question

I have a drop down box with values dynamically populated from a database. So, its HTML is somewhat like this:

<select id="productclass">
    <option value="1">Name1</option>
    <option value="7">Name2</option>
    <option value="11">Name11</option>
</select>

Where the id’s and the names are pulled from the database.

I need to be able to write JavaScript to select the option with a specific value. So, how can I make option #7 selected using JavaScript? I can use JQuery too if it’s easier.

Answer 1

If you want to select the option with value 7, use:

document.getElementById("productclass").value = "7";
$("#productclass").val("7");                         //jQuery

If you mean option number 7 by “#7“, use:

document.getElementById("productclass").selectedIndex = 6;
// Indexes are zero-based, the 7th element is referred through index 6