JQuery create new select option

Question

I have the below functions in regular JavaScript creating select options  Is there a way I can do this with jQuery without having to use the form object  Perhaps storing the options as an array of JSON objects and parsing this in the calling function     function populate form    form options length   0  form options 0    new Option  Select a city   town in Sweden       form options 1    new Option  Melbourne   Melbourne        Below is how I call the function above    populate document form county     county is the id of the dropdownlist to populate

User · Accepted Answer

Something like   function populate selector        selector       append   lt option value  foo  gt foo lt  option gt         append   lt option value  bar  gt bar lt  option gt       populate   myform  myselect      Or even     fn populate   function         this       append   lt option value  foo  gt foo lt  option gt         append   lt option value  bar  gt bar lt  option gt           myform  myselect   populate

User · Answer

If you need to make single element you can use this construction       lt option  gt           class   this dataID       text   this s dataValue    appendTo   subCategory      But if you need to print many elements you can use this construction   function printOptions arr       jQuery each arr  function                lt option  gt                   value   this dataID               text   this s dataValue            appendTo   subCategory

User · Answer

How about      county   append          lt option   gt             text  Select a city   town in Sweden            val              lt option   gt             text  Melbourne            val  Melbourne

User · Answer

This is confusing  When you say  form object   do you mean   lt select gt  element   If not  your code won t work  so I ll assume your form variable is in fact a reference to a  lt select gt  element  Why do you want to rewrite this code  What you have has worked in all scriptable browsers since around 1996  and won t stop working any time soon  Doing it with jQuery will immediately make your code slower  more error-prone and less compatible across browsers   Here s a function that uses your current code as a starting point and populates a  lt select gt  element from an object    lt select id  mySelect  gt  lt  select gt    lt script type  text javascript gt   function populateSelect select  optionsData        var options   select options  o  selected      options length   0      for  var i   0  len   optionsData length  i  lt  len    i            o   optionsData i           selected     o selected          options i    new Option o text  o value  selected  selected            var optionsData                   text   Select a city   town in Sweden           value                          text   Melbourne           value   Melbourne           selected  true           populateSelect document getElementById  mySelect    optionsData     lt  script gt

User · Answer

A really simple way to do this        create the option var opt       lt option gt    val  myvalue   text  my text       append option to the select element    my-select  append opt     This could be done in lots of ways  even in a single line if really you want to

User · Answer

What about  var option       lt option  gt     option attr    value    myValue     text  myText        county   append option

[javascript] JQuery create new select option

Examples related to javascript

Examples related to jquery

Examples related to html

Examples related to jquery-selectors