milind
milind

Reputation: 289

get multiple values from dropdownlist in JavaScript

How can I get the values selected in the drop-down list, using a JavaScript function? User can select multiple values from both the elements. Following are the elements I'm using. Thanks in advance.

<select name="icOptions" id="icOptions" style="display: none" multiple="multiple">
  <option value="Choose an Option" selected="selected">Choose a Team </option>
  <option value="IDX">IDX</option>
  <option value="Support">SUPPORT</option>
  <option value="webapps">WEBAPPS</option>
</select>

<select name="ocOptions" id="ocOptions" style="display: none" multiple="multiple">
  <option value="Choose an Option" selected="selected">Choose a TeamMember </option>
  <option value="sanjay740">sanjay740</option>
  <option value="milind740">milind740</option>
</select>

Upvotes: 4

Views: 35549

Answers (3)

nanobar
nanobar

Reputation: 66355

An ES6/functional style alternative to the accepted answer:

const values = Array.apply(null, e.target.options)
  .filter(option => option.selected)
  .map(option => option.value);

Upvotes: 0

Tamil
Tamil

Reputation: 5358

Really Awesome Library for your need using jQuery or Prototype http://harvesthq.github.com/chosen/ Have a look at it.

It supports select & multiselect in a really nice way

Upvotes: 0

Gwyn Howell
Gwyn Howell

Reputation: 5424

var fld = document.getElementById('icOptions');
var values = [];
for (var i = 0; i < fld.options.length; i++) {
  if (fld.options[i].selected) {
    values.push(fld.options[i].value);
  }
}
// do something with values

Upvotes: 13

Related Questions