Obtener valor del cuadro de selección múltiple usando jQuery JS o puros
-
23-09-2019 - |
Pregunta
En el código que se muestra a continuación, cómo obtener los valores del cuadro de selección múltiple en función val()
utilizando jQuery o JavaScript puro?
<script>
function val() {
//Get values of mutliselect drop down box
}
$(document).ready(function () {
var flag = 0;
$('#emp').change(function () {
var sub = $("OPTION:selected", this).val()
if (flag == 1) $('#new_row').remove();
$('#topics').val('');
var html = '<tr id="new_row" class="new_row"><td>Topics:</td><td> <select id="topic_l" name="topic_l" class="topic_l" multiple="multiple">';
var idarr = new Array();
var valarr = new Array(); { %
for top in dict.tops %
}
idarr.push('{{top.is}}');
valarr.push('{{pic.ele}}'); { % endfor %
}
for (var i = 0; i < idarr.length; i++) {
if (sub == idarr[i]) {
html += '<option value="' + idarr[i] + '" >' + valarr[i] + '</option>';
}
}
html += '</select></p></td></tr>';
$('#tops').append(html);
flag = 1;
});
});
</script>
Emp:
<select id="emp" name="emp">
<option value=""></option>
<option value="1">1</option>
</select>
<div name="tops" id="tops"></div>
<input type="submit" value="Create Template" id="create" onclick="javascript:var ret=val();return ret;">
Solución
val
la función llamada desde el select
devolverá una matriz si es un múltiple. $('select#my_multiselect').val()
devolverá una matriz de los valores de las opciones seleccionadas -. Usted no necesita recorrer y obtener por sí mismo
Otros consejos
Creo que la respuesta puede ser más fácil de entender como esto:
$('#empid').on('change',function() {
alert($(this).val());
console.log($(this).val());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<select id="empid" name="empname" multiple="multiple">
<option value="0">Potato</option>
<option value="1">Carrot</option>
<option value="2">Apple</option>
<option value="3">Raisins</option>
<option value="4">Peanut</option>
</select>
<br />
Hold CTRL / CMD for selecting multiple fields
Si selecciona "zanahoria" y "pasas" en la lista, la salida será "1,3".
var data=[];
var $el=$("#my-select");
$el.find('option:selected').each(function(){
data.push({value:$(this).val(),text:$(this).text()});
});
console.log(data)
De acuerdo con la página del widget de , que debe ser:
var myDropDownListValues = $("#myDropDownList").multiselect("getChecked").map(function()
{
return this.value;
}).get();
Funciona para mí:)
Esto me consiguió el valor y el texto de la opciones seleccionadas para la jQuery multiselect.js plugin:
$("#selectBox").multiSelect({
afterSelect: function(){
var selections = [];
$("#selectBox option:selected").each(function(){
var optionValue = $(this).val();
var optionText = $(this).text();
console.log("optionText",optionText);
// collect all values
selections.push(optionValue);
});
// use array "selections" here..
}
});
muy útil si lo que lo necesite para su evento "onchange";)
Se puede hacer como esto también.
<form action="ResultsDulith.php" id="intermediate" name="inputMachine[]" multiple="multiple" method="post">
<select id="selectDuration" name="selectDuration[]" multiple="multiple">
<option value="1 WEEK" >Last 1 Week</option>
<option value="2 WEEK" >Last 2 Week </option>
<option value="3 WEEK" >Last 3 Week</option>
<option value="4 WEEK" >Last 4 Week</option>
<option value="5 WEEK" >Last 5 Week</option>
<option value="6 WEEK" >Last 6 Week</option>
</select>
<input type="submit"/>
</form>
A continuación, tomar la selección múltiple del siguiente código PHP a continuación. Se imprime los múltiples valores seleccionados en consecuencia.
$shift=$_POST['selectDuration'];
print_r($shift);