35

En el código que se muestra a continuación, ¿cómo obtener los valores de la casilla de selección múltiple en la función val() usando jQuery o JavaScript puro?Obtiene el valor de la casilla de selección múltiple mediante jQuery o JS 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:&nbsp;&nbsp;&nbsp;&nbsp; 
<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;"> 

¡Gracias de antemano!

Respuesta

90

la función val llamada desde select devolverá una matriz si es un múltiplo. $('select#my_multiselect').val() devolverá una matriz de los valores de las opciones seleccionadas; no necesita realizar un bucle y obtenerlas usted mismo.

+0

El cuadro de selección múltiple se genera dinámicamente como se puede ver, así que cuando digo alerta ($ ('select # my_multiselect'). Val()); dice indefinido ... – Hulk

+0

Lo tengo gracias ......... – Hulk

+0

Solo para aclarar que era un selector de ejemplo, necesitaría averiguar qué selector usar según su dom/markup. – prodigitalson

22

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 ".

1

De acuerdo con la widget's page, que debe ser:

var myDropDownListValues = $("#myDropDownList").multiselect("getChecked").map(function() 
{ 
    return this.value;  
}).get(); 

Funciona para mí :)

1

Esto me consiguió el valor y el texto de las opciones seleccionadas para el 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 necesita para su evento "onChange";)

8
var data=[]; 
var $el=$("#my-select"); 
$el.find('option:selected').each(function(){ 
    data.push({value:$(this).val(),text:$(this).text()}); 
}); 
console.log(data) 
+0

¿Puedes explicar tu código, por favor? – ByteHamster

+0

este código es obtener el valor y el texto seleccionados y luego presionar para ordenar –

0

Podría hacer 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, tome la selección múltiple del siguiente código PHP a continuación. Imprime los valores múltiples seleccionados en consecuencia.

$shift=$_POST['selectDuration']; 

print_r($shift); 
Cuestiones relacionadas