Set the selected index of a Dropdown using jQuery

Question

How do I set the index of a dropdown in jQuery if the way I m finding the control is as follows        id       originalId            I do it this way because I m creating controls dynamically and since the ids are changed when using Web Forms  I found this as a work around to find me some controls  But once I have the jQuery object  I do not know how to set the selected index to 0  zero

User · Answer

I m using       elem   val  xyz      to select the option element that has value  xyz

User · Answer

JQuery code       sel status   prop  selectedIndex  1     Jsp Code   Status   lt select name  sel status      id  sel status  gt       lt option value  1  gt -Status- lt  option gt       lt option gt ALL lt  option gt       lt option gt SENT lt  option gt       lt option gt RECEIVED lt  option gt       lt option gt DEACTIVE lt  option gt   lt  select gt

User · Answer

This also work proper in chrome and internet Explorer    quot  MainContent cmbEvalStatus quot   prop  quot selectedIndex quot   1  change     Put according your choice possition value of DropDown 0 1 2 3 4

User · Answer

This will work   lt head gt       lt script type  quot text javascript quot  gt          function Init                  var counter   document getElementById   quot counter quot                for  var i   1  i  lt  1000  i                      var option   new Option  i  i                   counter options add  option                             counter focus                                function OnKeyPressCounter  event  counter                var chCode     charCode  in event    event charCode   event keyCode                       if  chCode    68                            if  counter selectedIndex  lt  counter options length - 1                        counter selectedIndex                                                if  chCode    45    -                       if  counter selectedIndex  gt  0                        counter selectedIndex--                                                 lt  script gt   lt  head gt   lt body onload  quot Init    quot  gt      Use the   and - keys to increase decrease the counter       lt select id  quot counter quot  onkeypress  quot OnKeyPressCounter event  this  quot  style  quot width 80px quot  gt  lt  select gt   lt  body gt

User · Answer

Just found this  it works for me and I personally find it easier to read   This will set the actual index just like gnarf s answer number 3 option      sets selected index of a select box the actual index of 0     select elem   attr  selectedIndex   0     This didn t used to work but does now    see bug  http   dev jquery com ticket 1474  Addendum  As recommended in the comments use       select elem   prop  selectedIndex   0

User · Answer

To select the 2nd option      your-select-box-id  nth-child 2    prop  selected   true       Here we add the  trigger  change   to make the event fire       your-select-box-id  nth-child 2    prop  selected   true  trigger  change

User · Answer

I m writing this answer in 2015  and for some reason  probably older versions of jQuery  none of the other answers have worked for me  I mean  they change the selected index  but it doesn t actually reflect on the actual dropdown   Here is another way to change the index  and actually have it reflect in the dropdown       mydropdown   val  first   change

User · Answer

Select 4th option      select   val     select option   eq 3  val       example on jsfiddle

User · Answer

First of all - that selector is pretty slow   It will scan every DOM element looking for the ids   It will be less of a performance hit if you can assign a class to the element       myselect     To answer your question though  there are a few ways to change the select elements value in jQuery     sets selected index of a select box to the option with the value  0     select elem   val  0         sets selected index of a select box to the option with the value       select elem   val           sets selected index to first item using the DOM    select elem   0  selectedIndex   0      sets selected index to first item using jQuery  can work on multiple elements     select elem   prop  selectedIndex   0

User · Answer

id       originalId         val  0 index value      will set it to 0

User · Answer

You want to grab the value of the first option in the select element        id       originalId         val      id       originalId       option first   attr  value

[jquery] Set the selected index of a Dropdown using jQuery

Examples related to jquery