Javascript set selected option

Question

I am trying to programmatically set a <select>'s option using the code below. The value is being set for the select, but the option is not reflecting it. Any help would be greatly appreciated.

Set select value:

document.getElementById('cunit_usergroup').setAttribute('value', '3');

HTML:

<select id="cunit_usergroup" class="input_select" tabindex="1" name="cunit_usergroup" value="3">
   <option value="62">2nd Aviation Detachment</option>
   <option value="3">3rd Infantry Division</option>
   <option value="77">Alpha Company Headquarters</option>
   <option value="4">Alpha Company Leadership  </option>
   <option value="5">Banned</option>
   <option value="13">Base Maintenance Operations</option>
   <option value="9">Civillian</option>
   <option value="17">Combat Imaging and Development</option>
   <option value="10">Corps of Engineers  </option>
   <option value="48">Enlistee's</option>
   <option value="74">First Platoon Leadership</option>
   <option value="50">First Platoon, First Squad</option>
   <option value="61">First Platoon, Fourth Squad</option>
   <option value="51">First Platoon, Second Squad</option>
   <option value="46">First Platoon, Third Squad</option>
   <option value="11">Force Improvement Group</option>
   <option value="2">Guests</option>
   <option value="63">PERSCOM System</option>
   <option value="14">Public Affairs Office</option>
   <option value="12">Recruiting and Retention Office</option>
   <option value="49">Retired Personnel</option>
   <option value="75">Second Platoon Leadership</option>
   <option value="69">Second Platoon, First Squad</option>
   <option value="72">Second Platoon, Fourth Squad</option>
   <option value="70">Second Platoon, Second Squad</option>
   <option value="71">Second Platoon, Third Squad</option>
   <option value="76">Third Platoon Leadership</option>
   <option value="52">Third Platoon, First Squad</option>
   <option value="73">Third Platoon, Fourth Squad</option>
   <option value="65">Third Platoon, Second Squad</option>
   <option value="66">Third Platoon, Third Squad</option>
   <option value="1">Validating</option>
</select>

As you can see, the value is being set to 3, yet, 2nd Aviation Detachment is the option being shown.

You've got to set the `selectedIndex` of the `select` – tymeJV Jul 22 '15 at 00:02 — tymeJV, Jul 22 '15 at 00:02

angelcool.net · Answer 1 · 2015-07-22T00:18:39.923

0

Try this:

document.getElementById('cunit_usergroup').value='3';

Good luck!!

jsFiddle demo

edited Jul 22 '15 at 00:18

answered Jul 22 '15 at 00:10

angelcool.net

2,505
1
24
26

This does not work as well. – Jon Erickson Jul 22 '15 at 00:16
The demo works for me. – angelcool.net Jul 22 '15 at 00:19
I wonder if it has to do with the fact that it is in a modal display window that gets presented... Its not working for me. I have it exactly as you do. – Jon Erickson Jul 22 '15 at 00:28
Check the browser console for any errors. – angelcool.net Jul 22 '15 at 02:53

Javascript set selected option

1 Answers1