Jquery add "selected" on dropdown menu

Question

I have a simple dropdown menu with some options eg:

<select name='music_style' id='palmsForm-music_style'>
   <option value='1'  >Alternative and Indie</option>
   <option value='2'  >Clubs and Dance</option>
   <option value='3'  >Country/Folk</option>
   <option value='4'  >Hard Rock/Metal</option>
   <option value='5'  >Jazz/Blues</option>
   <option value='6'  >R&B/Urban Soul</option>
   <option value='7'  >Rap and Hip-Hop</option>
   <option value='8'  >Rock/Pop</option>
   <option value='9'  >Other</option>
</select>

I use a API for creating the form, so would prefer if there was a way to via jquery choose which of the options should be selected by default based upon the value of the option.

Is this possible? Thanks for helping!

duplicate of http://stackoverflow.com/questions/314636/how-do-you-select-a-particular-option-in-a-select-element-in-jquery — nathan gonzalez, Jan 11 '11 at 17:06

score 13 · Accepted Answer · answered Jan 11 '11 at 16:56

13

Programmatically set the selected item:

$("#palmsForm-music_style").val(2);

This will select Country/Folk (0 count).

answered Jan 11 '11 at 16:56

JasCav

34,458
20
113
170

Thanks a lot, that works :) (will accept answer when I can :)) – Jacob Jan 11 '11 at 17:00

score 2 · Answer 2 · answered Jan 07 '14 at 16:41

2

You can also use this for selecting option from dd list

$(document).ready(function(){
var value= "6";
$('#palmsForm-music_style [value='+value+']').prop('selected', true);
});

answered Jan 07 '14 at 16:41

Rehan Mobin

558
2
14

score 2 · Answer 3 · answered Jan 11 '11 at 17:09

2

Because you are using an API and you may not have control over the markup, you could add to the name of the default record something line " [Default]" and then use jQuery to select it.

Markup:

<select name='music_style' id='palmsForm-music_style'>
   ...
   <option value='5'>Jazz/Blues [Default]</option>
   ...
</select>

jQuery:

$("#palmsForm-music_style").val($("#palmsForm-music_style option:contains('[Default]')").val());

answered Jan 11 '11 at 17:09

Tim Santeford

27,385
16
74
101

yes this is also useful for dynamically-populated values! thanks! – weather Nov 29 '12 at 04:41

Jquery add "selected" on dropdown menu

3 Answers3