Cannot select option with Javascript

Question

I'm trying to select an option of a Dropdownlist using Javascript. My html Looks like the following:

<select id="active-drop" name="active">
    <option value="true">Aktiv</option>
    <option value="false"> Inaktiv </option> 
</select>

and my Javascript look like this:

$("#active-drop option[value='true']").attr("selected",true);
$("#active-drop option[value='false']").attr("selected",false);

The Problem here is, the Attribute is set just fine but the UI isn'z updated accordingly.

btw I already tried using selectedIndex but this yielded the same result(the data is set correctly but the UI isn't updated)

Check for duplicate IDs and make sure code is running after page is loaded. — Tushar, Jun 27 '16 at 13:16
Same question was answered here: http://stackoverflow.com/questions/13343566/set-select-option-selected-by-value — Benjamin Schüller, Jun 27 '16 at 13:18
Your selector is wrong `console.log($("#active-drop option[value='true']"))` is `null` — RaV, Jun 27 '16 at 13:19

score 0 · Answer 1 · answered Jun 27 '16 at 13:19

0

Try this:

<select id="active-drop" name="active">
    <option class="selected" value="true">Aktiv</option>
    <option value="false"> Inaktiv </option> 
</select>

And this

$(".selected").prop("selected",true);

answered Jun 27 '16 at 13:19

Adam Eros

1,438
1
10
7

score 0 · Accepted Answer · answered Jun 27 '16 at 13:20

As Tushar said:

$('#active-drop [value="true"]').prop('selected', true);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="active-drop" name="active">
    <option value="">Just to prove it</option>
    <option value="true">Aktiv</option>
    <option value="false"> Inaktiv </option> 
</select>

score 0 · Answer 3 · answered Jun 27 '16 at 13:29

try this one using Jquery:

$('#active').val('ab');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="active" name="active">
  <option value="ab">Aktiv</option>
  <option value="cs">Inaktiv</option>
</select>

Cannot select option with Javascript

3 Answers3