How do you select a particular option in a SELECT element in jQuery

Question

If you know the Index  Value or Text  also if you don t have an ID for a direct reference   This  this and this are all helpful answers   Example markup   lt div class  selDiv  gt     lt select class  opts  gt       lt option selected value  DEFAULT  gt Default lt  option gt       lt option value  SEL1  gt Selection 1 lt  option gt       lt option value  SEL2  gt Selection 2 lt  option gt     lt  select gt   lt  div gt

User · Answer

By value  what worked for me with jQuery 1 7 was the below code  try this       id option value theOptionValue    prop  selected    selected   change

User · Answer

For setting select value with triggering selected       select opts   val  SEL1   change        For setting option from a scope       selDiv option value  SEL1          attr  selected    selected        change      This code use selector to find out the select object with condition  then change the selected attribute by attr       Futher  I recommend to add change   event after setting attribute to selected  by doing this the code will close to changing select by user

User · Answer

elem  find  option value      value         attr  selected    selected

User · Answer

Answering my own question for documentation  I m sure there are other ways to accomplish this  but this works and this code is tested    lt html gt   lt head gt   lt script language  Javascript  src  javascript jquery-1 2 6 min js  gt  lt  script gt   lt script type  text JavaScript  gt     function             update   bind  click           bind the click event to a div         function                 var selectOption       selDiv   children   opts                 var  this     this  next   children   opts                    selectOption  find  option index  0     attr  selected   selected                  selectOption  find  option value  DEFAULT     attr  selected   selected                  selectOption  find  option text  Default     attr  selected   selected                     this  find  option value  DEFAULT     attr  selected   selected                   this  find  option text  Default     attr  selected   selected                   this  find  option index  0     attr  selected   selected                END Bind        End eventlistener   lt  script gt   lt  head gt   lt body gt   lt div class  update  style  height 50px  color blue  cursor pointer   gt Update lt  div gt   lt div class  selDiv  gt           lt select class  opts  gt               lt option selected value  DEFAULT  gt Default lt  option gt               lt option value  SEL1  gt Selection 1 lt  option gt               lt option value  SEL2  gt Selection 2 lt  option gt           lt  select gt       lt  div gt   lt  body gt   lt  html gt

User · Answer

There are a few suggestions why you should use prop instead of attr  Definitely use prop as I ve tested both and attr will give you weird results except for the simplest of cases  I wanted a solution where selecting from an arbitrarily grouped select options automatically selected another select input on that same page  So for instance  if you have 2 dropdowns - one for countries  and the other for continents  In this scenario  selecting any country automatically selected that country s continent on the other continent dropdown   x000D   x000D      country   on  change   function         get continent   var originLocationRegion     this  find   selected   data  origin-region         select continent correctly with prop       continent option value      originLocationRegion         prop  selected   true              country2   on  change   function         get continent   var originLocationRegion     this  find   selected   data  origin-region         select continent wrongly with attr       continent2 option value      originLocationRegion         attr  selected   true       x000D   lt link href  https   stackpath bootstrapcdn com bootstrap 4 5 2 css bootstrap min css  rel  stylesheet    gt   lt script src  https   cdnjs cloudflare com ajax libs jquery 3 3 1 jquery min js  gt  lt  script gt    lt div class  container  gt     lt form gt       lt h4 class  text-success  gt Props to the good stuff     lt  h4 gt       lt div class  form-row  gt         lt div class  form-group col-md-6 col-sm-6  gt           lt label gt Conuntries lt  label gt           lt select class  custom-select country  id  country  gt             lt option disabled selected gt Select Country  lt  option gt             lt option data-origin-region  Asia  value  Afghanistan  gt Afghanistan lt  option gt             lt option data-origin-region  Antartica  value  Antartica  gt Antartica lt  option gt             lt option data-origin-region  Australia  value  Australia  gt Australia lt  option gt             lt option data-origin-region  Europe  value  Austria  gt Austria lt  option gt             lt option data-origin-region  Asia  value  Bangladesh  gt Bangladesh lt  option gt             lt option data-origin-region  South America  value  Brazil  gt Brazil lt  option gt             lt option data-origin-region  Africa  value  Cameroon  gt Cameroon lt  option gt             lt option data-origin-region  North America  value  Canada  gt Canada lt  option gt             lt option data-origin-region  South America  value  Chile  gt Chile lt  option gt             lt option data-origin-region  Asia  value  China  gt China lt  option gt             lt option data-origin-region  South America  value  Ecuador  gt Ecuador lt  option gt             lt option data-origin-region  Australia  value  Fiji  gt Fiji lt  option gt             lt option data-origin-region  North America  value  Mexico  gt Mexico lt  option gt             lt option data-origin-region  Australia  value  New Zealand  gt New Zealand lt  option gt             lt option data-origin-region  Africa  value  Nigeria  gt Nigeria lt  option gt             lt option data-origin-region  Europe  value  Portugal  gt Portugal lt  option gt             lt option data-origin-region  Africa  value  Seychelles  gt Seychelles lt  option gt             lt option data-origin-region  North America  value  United States  gt United States lt  option gt             lt option data-origin-region  Europe  value  United Kingdom  gt United Kingdom lt  option gt           lt  select gt         lt  div gt         lt div class  form-group col-md-6 col-sm-6  gt           lt label gt Continent lt  label gt           lt select class  custom-select  id  continent  gt             lt option disabled selected gt Select Continent lt  option gt             lt option disabled value  Africa  gt Africa lt  option gt             lt option disabled value  Antartica  gt Antartica lt  option gt             lt option disabled value  Asia  gt Asia lt  option gt             lt option disabled value  Europe  gt Europe lt  option gt             lt option disabled value  North America  gt North America lt  option gt             lt option disabled value  Australia  gt Australia lt  option gt             lt option disabled value  South America  gt South America lt  option gt           lt  select gt         lt  div gt       lt  div gt     lt  form gt     lt hr gt      lt form gt       lt h4 class  text-danger  gt  Attributing the bad stuff to attr  lt  h4 gt       lt div class  form-row  gt         lt div class  form-group col-md-6 col-sm-6  gt           lt label gt Conuntries lt  label gt           lt select class  custom-select country-2  id  country2  gt             lt option disabled selected gt Select Country  lt  option gt             lt option data-origin-region  Asia  value  Afghanistan  gt Afghanistan lt  option gt             lt option data-origin-region  Antartica  value  Antartica  gt Antartica lt  option gt             lt option data-origin-region  Australia  value  Australia  gt Australia lt  option gt             lt option data-origin-region  Europe  value  Austria  gt Austria lt  option gt             lt option data-origin-region  Asia  value  Bangladesh  gt Bangladesh lt  option gt             lt option data-origin-region  South America  value  Brazil  gt Brazil lt  option gt             lt option data-origin-region  Africa  value  Cameroon  gt Cameroon lt  option gt             lt option data-origin-region  North America  value  Canada  gt Canada lt  option gt             lt option data-origin-region  South America  value  Chile  gt Chile lt  option gt             lt option data-origin-region  Asia  value  China  gt China lt  option gt             lt option data-origin-region  South America  value  Ecuador  gt Ecuador lt  option gt             lt option data-origin-region  Australia  value  Fiji  gt Fiji lt  option gt             lt option data-origin-region  North America  value  Mexico  gt Mexico lt  option gt             lt option data-origin-region  Australia  value  New Zealand  gt New Zealand lt  option gt             lt option data-origin-region  Africa  value  Nigeria  gt Nigeria lt  option gt             lt option data-origin-region  Europe  value  Portugal  gt Portugal lt  option gt             lt option data-origin-region  Africa  value  Seychelles  gt Seychelles lt  option gt             lt option data-origin-region  North America  value  United States  gt United States lt  option gt             lt option data-origin-region  Europe  value  United Kingdom  gt United Kingdom lt  option gt           lt  select gt         lt  div gt         lt div class  form-group col-md-6 col-sm-6  gt           lt label gt Continent lt  label gt           lt select class  custom-select  id  continent2  gt             lt option disabled selected gt Select Continent lt  option gt             lt option disabled value  Africa  gt Africa lt  option gt             lt option disabled value  Antartica  gt Antartica lt  option gt             lt option disabled value  Asia  gt Asia lt  option gt             lt option disabled value  Europe  gt Europe lt  option gt             lt option disabled value  North America  gt North America lt  option gt             lt option disabled value  Australia  gt Australia lt  option gt             lt option disabled value  South America  gt South America lt  option gt           lt  select gt         lt  div gt       lt  div gt     lt  form gt   lt  div gt  x000D   x000D   x000D   As seen in the code snippet  prop works correctly every time  but attr fails to select properly once the option has been selected once  Keypoint  We re usually interested in the property of the attribute  so its safer to use prop over attr in most situations

User · Answer

This will reset your select box with  -- Please Select --             lt script gt        document  ready function                 gate option value       prop  selected   true                lt  script gt

User · Answer

select option data-id-estado  3     prop  selected  true  trigger  change      or      select option value  myValue     prop  selected  true  trigger  change

User · Answer

Exactly it will work try this below methods     For normal select option    lt script gt            document  ready function             id   val  select value here                        lt  script gt       For select 2 option trigger option need to use    lt script gt                document  ready function                 id   val  select value here   trigger  change                                lt  script gt

User · Answer

select option data-id-estado  3     prop  selected  true  trigger  change      or      select option value  myValue     prop  selected  true  trigger  change

User · Answer

if you want to not use jQuery  you can use below code   document getElementById  mySelect   selectedIndex    2

User · Answer

Answering my own question for documentation  I m sure there are other ways to accomplish this  but this works and this code is tested    lt html gt   lt head gt   lt script language  Javascript  src  javascript jquery-1 2 6 min js  gt  lt  script gt   lt script type  text JavaScript  gt     function             update   bind  click           bind the click event to a div         function                 var selectOption       selDiv   children   opts                 var  this     this  next   children   opts                    selectOption  find  option index  0     attr  selected   selected                  selectOption  find  option value  DEFAULT     attr  selected   selected                  selectOption  find  option text  Default     attr  selected   selected                     this  find  option value  DEFAULT     attr  selected   selected                   this  find  option text  Default     attr  selected   selected                   this  find  option index  0     attr  selected   selected                END Bind        End eventlistener   lt  script gt   lt  head gt   lt body gt   lt div class  update  style  height 50px  color blue  cursor pointer   gt Update lt  div gt   lt div class  selDiv  gt           lt select class  opts  gt               lt option selected value  DEFAULT  gt Default lt  option gt               lt option value  SEL1  gt Selection 1 lt  option gt               lt option value  SEL2  gt Selection 2 lt  option gt           lt  select gt       lt  div gt   lt  body gt   lt  html gt

User · Answer

By value  what worked for me with jQuery 1 7 was the below code  try this       id option value theOptionValue    prop  selected    selected   change

User · Answer

You could name the select and use this      select name  theNameYouChose     find  option value  theValueYouWantSelected     attr  selected  true     It should select the option you want

User · Answer

For Jquery chosen if you send the attribute to function and need to update-select option      yourElement option value    yourValue       attr  selected    selected        editLocationCity   chosen   change        editLocationCity   trigger  liszt updated

User · Answer

There are a number of ways to do this  but the cleanest approach has been lost among the top answers and loads of arguments over val    Also some methods changed as of jQuery 1 6  so this needs an update   For the following examples I will assume the variable  select is a jQuery object pointing at the desired  lt select gt  tag  e g  via the following   var  select       selDiv  opts      Note 1 - use val   for value matches   For value matching  using val   is far simpler than using an attribute selector  https   jsfiddle net yz7tu49b 6    select val  SEL2      The setter version of  val   is implemented on select tags by setting the selected property of a matching option with the same value  so works just fine on all modern browsers   Note 2 - use prop  selected   true    If you want to set the selected state of an option directly  you can use prop  not attr  with a boolean parameter  rather than the text value selected    e g  https   jsfiddle net yz7tu49b    option prop  selected   true       Will add selected  selected  to the tag   Note 3 - allow for unknown values   If you use val   to select an  lt option gt   but the val is not matched  might happen depending on the source of the values   then  nothing  is selected and  select val   will return null   So  for the example shown  and for the sake of robustness  you could use something like this https   jsfiddle net 1250Ldqn    var  select       selDiv  opts     select val  SEL2    if   select val      null       select val  DEFAULT        Note 4 - exact text match   If you want to match by exact text  you can use a filter with function  e g  https   jsfiddle net yz7tu49b 2    var  select       selDiv  opts     select children   filter function        return this text     Selection 2      prop  selected   true     although if you may have extra whitespace you may want to add a trim to the check as in       return   trim this text      some value to match     Note 5 - match by index  If you want to match by index just index the children of the select e g  https   jsfiddle net yz7tu49b 3   var  select       selDiv  opts    var index   2   select children   index  selected   true    Although I tend to avoid direct DOM properties in favour of jQuery nowadays  to future-proof code  so that could also be done as https   jsfiddle net yz7tu49b 5    var  select       selDiv  opts    var index   2   select children   eq index  prop  selected   true     Note 6 - use change   to fire the new selection  In all the above cases  the change event does not fire  This is by design so that you do not wind up with recursive change events   To generate the change event  if required  just add a call to  change   to the jQuery select object  e g  the very first simplest example becomes https   jsfiddle net yz7tu49b 7   var  select       selDiv  opts     select val  SEL2   change      There are also plenty of other ways to find the elements using attribute selectors  like  value  SEL2    but you have to remember attribute selectors are relatively slow compared to all these other options

User · Answer

elem  find  option value      value         attr  selected    selected

User · Answer

i ll go with -     select my-select option    each function     this selected    this text    myVal

User · Answer

i ll go with -     select my-select option    each function     this selected    this text    myVal

User · Answer

Answering my own question for documentation  I m sure there are other ways to accomplish this  but this works and this code is tested    lt html gt   lt head gt   lt script language  Javascript  src  javascript jquery-1 2 6 min js  gt  lt  script gt   lt script type  text JavaScript  gt     function             update   bind  click           bind the click event to a div         function                 var selectOption       selDiv   children   opts                 var  this     this  next   children   opts                    selectOption  find  option index  0     attr  selected   selected                  selectOption  find  option value  DEFAULT     attr  selected   selected                  selectOption  find  option text  Default     attr  selected   selected                     this  find  option value  DEFAULT     attr  selected   selected                   this  find  option text  Default     attr  selected   selected                   this  find  option index  0     attr  selected   selected                END Bind        End eventlistener   lt  script gt   lt  head gt   lt body gt   lt div class  update  style  height 50px  color blue  cursor pointer   gt Update lt  div gt   lt div class  selDiv  gt           lt select class  opts  gt               lt option selected value  DEFAULT  gt Default lt  option gt               lt option value  SEL1  gt Selection 1 lt  option gt               lt option value  SEL2  gt Selection 2 lt  option gt           lt  select gt       lt  div gt   lt  body gt   lt  html gt

User · Answer

Using jquery-2 1 4  I found the following answer to work for me       MySelectionBox   val 123  change      If you have a string value try the following       MySelectionBox   val  extra thing   change      Other examples did not work for me so that s why I m adding this answer   I found the original answer at   https   forum jquery com topic how-to-dynamically-select-option-in-dropdown-menu

User · Answer

Thanks for the question  Hope this piece of code will work for you   var val      select opts visible option selected    val

User · Answer

You can just use val   method      select   val  the value

User · Answer

Exactly it will work try this below methods     For normal select option    lt script gt            document  ready function             id   val  select value here                        lt  script gt       For select 2 option trigger option need to use    lt script gt                document  ready function                 id   val  select value here   trigger  change                                lt  script gt

User · Answer

A selector to get the middle option-element by value is      selDiv option value  SEL1       For an index       selDiv option eq 1      For a known text       selDiv option contains  Selection 1       EDIT  As commented above the OP might have been after changing the selected item of the dropdown  In version 1 6 and higher the prop   method is recommended       selDiv option eq 1    prop  selected   true    In older versions       selDiv option eq 1    attr  selected    selected     EDIT2  after Ryan s comment  A match on  Selection 10  might be unwanted  I found no selector to match the full text  but a filter works        selDiv option        filter function i  e    return   e  text       Selection 1      EDIT3  Use caution with   e  text   as it can contain a newline making the comparison fail   This happens when the options are implicitly closed  no  lt  option gt  tag     lt select     gt   lt option value  1  gt Selection 1  lt option value  2  gt Selection 2       lt  select gt    If you simply use e text any extra whitespace like the trailing newline will be removed  making the comparison more robust

User · Answer

Answering my own question for documentation  I m sure there are other ways to accomplish this  but this works and this code is tested    lt html gt   lt head gt   lt script language  Javascript  src  javascript jquery-1 2 6 min js  gt  lt  script gt   lt script type  text JavaScript  gt     function             update   bind  click           bind the click event to a div         function                 var selectOption       selDiv   children   opts                 var  this     this  next   children   opts                    selectOption  find  option index  0     attr  selected   selected                  selectOption  find  option value  DEFAULT     attr  selected   selected                  selectOption  find  option text  Default     attr  selected   selected                     this  find  option value  DEFAULT     attr  selected   selected                   this  find  option text  Default     attr  selected   selected                   this  find  option index  0     attr  selected   selected                END Bind        End eventlistener   lt  script gt   lt  head gt   lt body gt   lt div class  update  style  height 50px  color blue  cursor pointer   gt Update lt  div gt   lt div class  selDiv  gt           lt select class  opts  gt               lt option selected value  DEFAULT  gt Default lt  option gt               lt option value  SEL1  gt Selection 1 lt  option gt               lt option value  SEL2  gt Selection 2 lt  option gt           lt  select gt       lt  div gt   lt  body gt   lt  html gt

User · Answer

I use this  when i know the index of the list       yourlist  nth 1    prop  selected   selected   change      This allows the list to change  and fire the change event  The   nth n   is counting from index 0

User · Answer

For Jquery chosen if you send the attribute to function and need to update-select option      yourElement option value    yourValue       attr  selected    selected        editLocationCity   chosen   change        editLocationCity   trigger  liszt updated

User · Answer

The    select   val  the value    looks the right solution and if you have data table rows then    row find   component   val  All

User · Answer

Try this  you just use select field id instead of  id  ie  select name   instead of option value use your select option value    lt script gt        document  ready function         id option value  option value     attr  selected  true               lt  script gt

User · Answer

Try this  you just use select field id instead of  id  ie  select name   instead of option value use your select option value    lt script gt        document  ready function         id option value  option value     attr  selected  true               lt  script gt

User · Answer

There are a few suggestions why you should use prop instead of attr  Definitely use prop as I ve tested both and attr will give you weird results except for the simplest of cases  I wanted a solution where selecting from an arbitrarily grouped select options automatically selected another select input on that same page  So for instance  if you have 2 dropdowns - one for countries  and the other for continents  In this scenario  selecting any country automatically selected that country s continent on the other continent dropdown   x000D   x000D      country   on  change   function         get continent   var originLocationRegion     this  find   selected   data  origin-region         select continent correctly with prop       continent option value      originLocationRegion         prop  selected   true              country2   on  change   function         get continent   var originLocationRegion     this  find   selected   data  origin-region         select continent wrongly with attr       continent2 option value      originLocationRegion         attr  selected   true       x000D   lt link href  https   stackpath bootstrapcdn com bootstrap 4 5 2 css bootstrap min css  rel  stylesheet    gt   lt script src  https   cdnjs cloudflare com ajax libs jquery 3 3 1 jquery min js  gt  lt  script gt    lt div class  container  gt     lt form gt       lt h4 class  text-success  gt Props to the good stuff     lt  h4 gt       lt div class  form-row  gt         lt div class  form-group col-md-6 col-sm-6  gt           lt label gt Conuntries lt  label gt           lt select class  custom-select country  id  country  gt             lt option disabled selected gt Select Country  lt  option gt             lt option data-origin-region  Asia  value  Afghanistan  gt Afghanistan lt  option gt             lt option data-origin-region  Antartica  value  Antartica  gt Antartica lt  option gt             lt option data-origin-region  Australia  value  Australia  gt Australia lt  option gt             lt option data-origin-region  Europe  value  Austria  gt Austria lt  option gt             lt option data-origin-region  Asia  value  Bangladesh  gt Bangladesh lt  option gt             lt option data-origin-region  South America  value  Brazil  gt Brazil lt  option gt             lt option data-origin-region  Africa  value  Cameroon  gt Cameroon lt  option gt             lt option data-origin-region  North America  value  Canada  gt Canada lt  option gt             lt option data-origin-region  South America  value  Chile  gt Chile lt  option gt             lt option data-origin-region  Asia  value  China  gt China lt  option gt             lt option data-origin-region  South America  value  Ecuador  gt Ecuador lt  option gt             lt option data-origin-region  Australia  value  Fiji  gt Fiji lt  option gt             lt option data-origin-region  North America  value  Mexico  gt Mexico lt  option gt             lt option data-origin-region  Australia  value  New Zealand  gt New Zealand lt  option gt             lt option data-origin-region  Africa  value  Nigeria  gt Nigeria lt  option gt             lt option data-origin-region  Europe  value  Portugal  gt Portugal lt  option gt             lt option data-origin-region  Africa  value  Seychelles  gt Seychelles lt  option gt             lt option data-origin-region  North America  value  United States  gt United States lt  option gt             lt option data-origin-region  Europe  value  United Kingdom  gt United Kingdom lt  option gt           lt  select gt         lt  div gt         lt div class  form-group col-md-6 col-sm-6  gt           lt label gt Continent lt  label gt           lt select class  custom-select  id  continent  gt             lt option disabled selected gt Select Continent lt  option gt             lt option disabled value  Africa  gt Africa lt  option gt             lt option disabled value  Antartica  gt Antartica lt  option gt             lt option disabled value  Asia  gt Asia lt  option gt             lt option disabled value  Europe  gt Europe lt  option gt             lt option disabled value  North America  gt North America lt  option gt             lt option disabled value  Australia  gt Australia lt  option gt             lt option disabled value  South America  gt South America lt  option gt           lt  select gt         lt  div gt       lt  div gt     lt  form gt     lt hr gt      lt form gt       lt h4 class  text-danger  gt  Attributing the bad stuff to attr  lt  h4 gt       lt div class  form-row  gt         lt div class  form-group col-md-6 col-sm-6  gt           lt label gt Conuntries lt  label gt           lt select class  custom-select country-2  id  country2  gt             lt option disabled selected gt Select Country  lt  option gt             lt option data-origin-region  Asia  value  Afghanistan  gt Afghanistan lt  option gt             lt option data-origin-region  Antartica  value  Antartica  gt Antartica lt  option gt             lt option data-origin-region  Australia  value  Australia  gt Australia lt  option gt             lt option data-origin-region  Europe  value  Austria  gt Austria lt  option gt             lt option data-origin-region  Asia  value  Bangladesh  gt Bangladesh lt  option gt             lt option data-origin-region  South America  value  Brazil  gt Brazil lt  option gt             lt option data-origin-region  Africa  value  Cameroon  gt Cameroon lt  option gt             lt option data-origin-region  North America  value  Canada  gt Canada lt  option gt             lt option data-origin-region  South America  value  Chile  gt Chile lt  option gt             lt option data-origin-region  Asia  value  China  gt China lt  option gt             lt option data-origin-region  South America  value  Ecuador  gt Ecuador lt  option gt             lt option data-origin-region  Australia  value  Fiji  gt Fiji lt  option gt             lt option data-origin-region  North America  value  Mexico  gt Mexico lt  option gt             lt option data-origin-region  Australia  value  New Zealand  gt New Zealand lt  option gt             lt option data-origin-region  Africa  value  Nigeria  gt Nigeria lt  option gt             lt option data-origin-region  Europe  value  Portugal  gt Portugal lt  option gt             lt option data-origin-region  Africa  value  Seychelles  gt Seychelles lt  option gt             lt option data-origin-region  North America  value  United States  gt United States lt  option gt             lt option data-origin-region  Europe  value  United Kingdom  gt United Kingdom lt  option gt           lt  select gt         lt  div gt         lt div class  form-group col-md-6 col-sm-6  gt           lt label gt Continent lt  label gt           lt select class  custom-select  id  continent2  gt             lt option disabled selected gt Select Continent lt  option gt             lt option disabled value  Africa  gt Africa lt  option gt             lt option disabled value  Antartica  gt Antartica lt  option gt             lt option disabled value  Asia  gt Asia lt  option gt             lt option disabled value  Europe  gt Europe lt  option gt             lt option disabled value  North America  gt North America lt  option gt             lt option disabled value  Australia  gt Australia lt  option gt             lt option disabled value  South America  gt South America lt  option gt           lt  select gt         lt  div gt       lt  div gt     lt  form gt   lt  div gt  x000D   x000D   x000D   As seen in the code snippet  prop works correctly every time  but attr fails to select properly once the option has been selected once  Keypoint  We re usually interested in the property of the attribute  so its safer to use prop over attr in most situations

User · Answer

This will reset your select box with  -- Please Select --             lt script gt        document  ready function                 gate option value       prop  selected   true                lt  script gt

User · Answer

None of the methods above provided the solution I needed so I figured I would provide what worked for me       element option value  no     attr  selected    selected

User · Answer

A selector to get the middle option-element by value is      selDiv option value  SEL1       For an index       selDiv option eq 1      For a known text       selDiv option contains  Selection 1       EDIT  As commented above the OP might have been after changing the selected item of the dropdown  In version 1 6 and higher the prop   method is recommended       selDiv option eq 1    prop  selected   true    In older versions       selDiv option eq 1    attr  selected    selected     EDIT2  after Ryan s comment  A match on  Selection 10  might be unwanted  I found no selector to match the full text  but a filter works        selDiv option        filter function i  e    return   e  text       Selection 1      EDIT3  Use caution with   e  text   as it can contain a newline making the comparison fail   This happens when the options are implicitly closed  no  lt  option gt  tag     lt select     gt   lt option value  1  gt Selection 1  lt option value  2  gt Selection 2       lt  select gt    If you simply use e text any extra whitespace like the trailing newline will be removed  making the comparison more robust

User · Answer

For setting select value with triggering selected       select opts   val  SEL1   change        For setting option from a scope       selDiv option value  SEL1          attr  selected    selected        change      This code use selector to find out the select object with condition  then change the selected attribute by attr       Futher  I recommend to add change   event after setting attribute to selected  by doing this the code will close to changing select by user

User · Answer

I use this  when i know the index of the list       yourlist  nth 1    prop  selected   selected   change      This allows the list to change  and fire the change event  The   nth n   is counting from index 0

User · Answer

Thanks for the question  Hope this piece of code will work for you   var val      select opts visible option selected    val

User · Answer

Using jquery-2 1 4  I found the following answer to work for me       MySelectionBox   val 123  change      If you have a string value try the following       MySelectionBox   val  extra thing   change      Other examples did not work for me so that s why I m adding this answer   I found the original answer at   https   forum jquery com topic how-to-dynamically-select-option-in-dropdown-menu

User · Answer

The    select   val  the value    looks the right solution and if you have data table rows then    row find   component   val  All

User · Answer

You could name the select and use this      select name  theNameYouChose     find  option value  theValueYouWantSelected     attr  selected  true     It should select the option you want

User · Answer

None of the methods above provided the solution I needed so I figured I would provide what worked for me       element option value  no     attr  selected    selected

User · Answer

You can just use val   method      select   val  the value

User · Answer

There are a number of ways to do this  but the cleanest approach has been lost among the top answers and loads of arguments over val    Also some methods changed as of jQuery 1 6  so this needs an update   For the following examples I will assume the variable  select is a jQuery object pointing at the desired  lt select gt  tag  e g  via the following   var  select       selDiv  opts      Note 1 - use val   for value matches   For value matching  using val   is far simpler than using an attribute selector  https   jsfiddle net yz7tu49b 6    select val  SEL2      The setter version of  val   is implemented on select tags by setting the selected property of a matching option with the same value  so works just fine on all modern browsers   Note 2 - use prop  selected   true    If you want to set the selected state of an option directly  you can use prop  not attr  with a boolean parameter  rather than the text value selected    e g  https   jsfiddle net yz7tu49b    option prop  selected   true       Will add selected  selected  to the tag   Note 3 - allow for unknown values   If you use val   to select an  lt option gt   but the val is not matched  might happen depending on the source of the values   then  nothing  is selected and  select val   will return null   So  for the example shown  and for the sake of robustness  you could use something like this https   jsfiddle net 1250Ldqn    var  select       selDiv  opts     select val  SEL2    if   select val      null       select val  DEFAULT        Note 4 - exact text match   If you want to match by exact text  you can use a filter with function  e g  https   jsfiddle net yz7tu49b 2    var  select       selDiv  opts     select children   filter function        return this text     Selection 2      prop  selected   true     although if you may have extra whitespace you may want to add a trim to the check as in       return   trim this text      some value to match     Note 5 - match by index  If you want to match by index just index the children of the select e g  https   jsfiddle net yz7tu49b 3   var  select       selDiv  opts    var index   2   select children   index  selected   true    Although I tend to avoid direct DOM properties in favour of jQuery nowadays  to future-proof code  so that could also be done as https   jsfiddle net yz7tu49b 5    var  select       selDiv  opts    var index   2   select children   eq index  prop  selected   true     Note 6 - use change   to fire the new selection  In all the above cases  the change event does not fire  This is by design so that you do not wind up with recursive change events   To generate the change event  if required  just add a call to  change   to the jQuery select object  e g  the very first simplest example becomes https   jsfiddle net yz7tu49b 7   var  select       selDiv  opts     select val  SEL2   change      There are also plenty of other ways to find the elements using attribute selectors  like  value  SEL2    but you have to remember attribute selectors are relatively slow compared to all these other options

User · Answer

if you want to not use jQuery  you can use below code   document getElementById  mySelect   selectedIndex    2

[jquery] How do you select a particular option in a SELECT element in jQuery?

Examples related to jquery