How to add option to select list in jQuery

jquery html-select
danila dinan picture danila dinan · Nov 13, 2009 · Viewed 160.8k times · Source

My select list is called dropListBuilding. The following code does not seem to work:

 for (var i = 0; i < buildings.length; i++) {
     var val = buildings[i];
     var text = buildings[i];
     alert("value of builing at: " + i.toString() + " is: " + val);
     $("#dropListBuilding").addOption(val, text, false);
 }

This line dies: 

$("#dropListBuilding").addOption(val, text, false);

What is the right to add items to the drop down in jQuery? I have tested without that line and the buildings variable does have my data element.

Answer

HaMinh Nguyen picture HaMinh Nguyen · Mar 30, 2012

Don't make your code so complicated. It can be done simply as below by using a foreach-like iterator: 

$.each(buildings, function (index, value) {
    $('#dropListBuilding').append($('<option/>', { 
        value: value,
        text : value 
    }));
});

Related questions

Set select option 'selected', by value

I have a select field with some options in it. Now I need to select one of those options with jQuery. But how can I do that when I only know the value of the option that must be selected? …

Read More
Change the selected value of a drop-down list with jQuery

I have a drop-down list with known values. What I'm trying to do is set the drop down list to a particular value that I know exists using jQuery. Using regular JavaScript, I would do something like: ddl = document.getElementById("…

Read More
Adding options to a <select> using jQuery?

What's the easiest way to add an option to a dropdown using jQuery? Will this work? $("#mySelect").append('<option value=1>My option</option>');

Read More