How to Get All Selected Values from <Select Multiple=Multiple>

How to get all selected values of a multiple select box?

No jQuery:

// Return an array of the selected opion values
// select is an HTML select element
function getSelectValues(select) {
  var result = [];
  var options = select && select.options;
  var opt;

  for (var i=0, iLen=options.length; i<iLen; i++) {
    opt = options[i];

    if (opt.selected) {
      result.push(opt.value || opt.text);
    }
  }
  return result;
}

Quick example:

<select multiple>
  <option>opt 1 text
  <option value="opt 2 value">opt 2 text
</select>
<button onclick="
  var el = document.getElementsByTagName('select')[0];
  alert(getSelectValues(el));
">Show selected values</button>

How to get all selected values from multiple select option?

Use name as like problems[] instead of problems

//Simple Form and getting the values

<form name="s" method="post" action="" >
 <select multiple="multiple" name='problems[]' id='problems' class="inpBox multiple" size='50' style="height:150px;" >
        <option value="Cannot Copy">Cannot Copy</option>
        <option value="Cannot Print">Cannot Print</option>
        <option value="Cannot Print">Cannot Scan</option>
        <option value="Cannot Fax">Cannot Fax</option>
        <option value="Lines Appear When Printing/Copying">Lines Appear When Printing/Copying</option>
        <option value="Scan to Email Failed">Scan to Email Failed</option>
        <option value="Toner Low/Empty">Toner Low/Empty</option>
        <option value="Others">Others</option>
</select>
<input type="submit" name="submit" value="submit" />
</form>

<?php 
if (isset($_POST['submit'])) {
    $problems =  implode(',', $_POST['problems']);
    echo $problems;
}
?>

How to get multiple select box values using jQuery?

jQuery .val()

  var foo = $('#multiple').val();

Get selected value from multiple select on change in dynamic form

You can get all selected values in array as below:

function displayColorSelected() {
    var selected_value = $("[id='color-options']").toArray().map(x => $(x).val());
    console.log(selected_value);
}

Note: id selector will always return single element which will be first with that id. So you're getting value for first select only.

You can use attribute selector ([]) instead which will find every element with given id. So here $("[id='color-options']").toArray() will find every element with id equal to color-options and map(x => $(x).val()) will return only value part from the elements array.

Html select multiple get all values at onchange event

This example might help without jQuery:

function getSelectedOptions(sel) {  var opts = [],    opt;  var len = sel.options.length;  for (var i = 0; i < len; i++) {    opt = sel.options[i];
    if (opt.selected) {      opts.push(opt);      alert(opt.value);    }  }
  return opts;}

<select name="myarray[]" id="myarray" class="select2-select req" style="width: 90%;" onChange="getSelectedOptions(this)" multiple>  <option value="1">1</option>  <option value="2">2</option>  <option value="3">3</option></select>

Get selected values in a multi-select drop-down and insert them in a JSON

This is the right solution :

const addGenreTextbox = document.getElementById('selectGenre');

let GenreChoix = []
for (var i = 0; i < addGenreTextbox.options.length; i++) {
    if (addGenreTextbox.options[i].selected) {
        let result = {};
        result["id"] = addGenreTextbox.options[i].value;
        result["Nom"] = addGenreTextbox.options[i].text.trim();
        GenreChoix.push(result);
    }
}

How to get all unselected values from SELECT (Multiple) jQuery | JavaScript

You can do it like this:

$('#user-type').change(function(){
  var uns = $("option:not(:selected)",this).map(function() {
    return this.value
  }).get();
});

Demo

$('#user-type').change(function(){
  var uns = $("option:not(:selected)",this).map(function() {
    return this.value
  }).get();
  console.log(uns);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="user-type" multiple="multiple">
        <option value="1">Type-1</option>
        <option value="2">Type-1</option>
        <option value="3">Type-1</option>
    </select>

How to set values of multiple select using JavaScript

To programmatically set multiple value options on a multi-select, you need to manually add selected attributes to the <option> elements that you want to select.

One approach to this is as follows:

const select = document.getElementById('myselect')const selectValues = [1, 2];
/* Iterate options of select element */for (const option of document.querySelectorAll('#myselect option')) {
  /* Parse value to integer */  const value = Number.parseInt(option.value);
  /* If option value contained in values, set selected attribute */  if (selectValues.indexOf(value) !== -1) {    option.setAttribute('selected', 'selected');  }  /* Otherwise ensure no selected attribute on option */  else {    option.removeAttribute('selected');  }}

<select multiple name="myselect" id="myselect">  <option value="1">option1</option>  <option value="2">option2</option>  <option value="3">option3</option>  <option value="4">option4</option></select>

Javascript/jQuery: Set Values (Selection) in a multiple Select

Iterate through the loop using the value in a dynamic selector that utilizes the attribute selector.

var values="Test,Prof,Off";
$.each(values.split(","), function(i,e){
    $("#strings option[value='" + e + "']").prop("selected", true);
});

Working Example http://jsfiddle.net/McddQ/1/

How to get multiple selected values of select box in php?

If you want PHP to treat $_GET['select2'] as an array of options just add square brackets to the name of the select element like this: <select name="select2[]" multiple …

Then you can acces the array in your PHP script

<?php
header("Content-Type: text/plain");

foreach ($_GET['select2'] as $selectedOption)
    echo $selectedOption."\n";

$_GET may be substituted by $_POST depending on the <form method="…" value.