mostrar value de un select multiple al ir seleccionado

chalchis · #1 (**permalink**) 09/05/2005, 09:18

hola amigos tengo este detalle quiero ir mostrando en un alert las opciones que voy seleccionando en un selecte multiple tengo este codigo pero solo funciona para una opcion seleccionada

function sel()
{
var indice=document.forms.formulario.programas.options .selectedIndex;
var valor=document.forms.formulario.programas.options[indice].value;
alert (valor);
}

<form name="formulario">
<select name="programas[]" id="programas" multiple class="selectx" style="height:100px" disabled onchange="sel()">
<optgroup label="Licenciaturas">
<option value="ia">Informática Administrativa</option>
<option value="ci">Comercio Internacional</option>
<option value="cp">Contaduría Pública</option>
<option value="lc">Comunicación y Publicidad</option>
<option value="lm">Mercadotecnia</option>
<option value="ii">Ing. Industrial en Operaciones Internacionales</option>
</OPTGROUP>
</select>
</form>

kepawe · #2 (**permalink**) 09/05/2005, 18:41

Hola chalchis

Para saber los valores de selection multiple debe hacer un bucle sobre los elementos options, ya que la propiedad selectedIndex te devuelve sólo el índice del primer elemento que encuentre seleccionado.

Código:

<html>
<head>
<title></title>

<script language="JavaScript" type="text/javascript">
<!--



function display_selected(cf) {
 
	var cuantos = 0, msg ="";
	var label_optg = ""
       for (var ctr = 0; opt = cf.options[ctr]; ctr++) {
		   if(opt.parentNode.label) label_optg = opt.parentNode.label
           if (opt.selected) {
			    msg += "  - " + opt.text + "\n"; 
				cuantos++;
        }
    }
    alert ((cuantos > 1 ? "Ha seleccionado " + cuantos + " elementos":cuantos == 0 ?"No ha seleccionado ningún elemento":"Ha seleccionado " + cuantos + " elemento") + 
			        " en " + label_optg +":\n" + msg ) 
	
    
}

//-->
</script>

</head>
<body>

<form>

<br>
<form name="formulario">
<select name="programas[]" id="programas" multiple class="selectx" style="height:100px" onchange="display_selected(this) ">
<optgroup label="Licenciaturas"><option value="ia">Informática Administrativa</option>
<option value="ci">Comercio Internacional</option>
<option value="cp">Contaduría Pública</option>
<option value="lc">Comunicación y Publicidad</option>
<option value="lm">Mercadotecnia</option>
<option value="ii">Ing. Industrial en Operaciones Internacionales</option>
</optgroup>
</select>


   
</form>


</body>
</html>

Un saludo

chalchis · #3 (**permalink**) 09/05/2005, 19:17

Gracias por responder si me sirvio mucho