select inteligente
Publicado por manou (2 intervenciones) el 04/02/2005 15:33:03
Buenas, se me ha presentado el sigueiente problema.
Resulta que necesito montar 3 selects que dependen uno de otro en cascada. Para dos no hay problema, en la parte del codigo html comentado que pasteo al final de este comentario se puede ver. El problema es cuando tengo tres, de manera que el primero ejerce influencia sobre el segundo y el segundo sobre un tercero, ya que el tercero tiene que tener en cuanta tambien la seleccion que hay en el primero, ya que si no, como me ocurre a mi, se pueden seleccionar elementos perros de tipo scania... ;)
Cualqueir sugerencia sera superbienrecibida.
Muchas gracias por adelantado, de momento voy a seguir pensando a ver...
----
Para que quede mas claro lo que pretento se pude ver el ejemplo en: http://acad5084act.uji.es/test_combos.html.
---
El codigo es el siguiente:
<html>
<head>
<script language="javascript">
combo_values01 =[ ["-----","verde_claro","rojo_claro","azul_claro"],["-----","verde_oscuro","rojo_oscuro"] ];
combo_values02 =[ ["-----","camion","coche","moto","autobus"],["-----","perro","gato","mariposa","elefante","orangutan","serpiente"] ];
combo_values03 =[ ["-----","scania","pegasso"],["-----","seat","opel","ford"] ];
function create_select (idSelect_to_query,idSelect_to_modify,values) {
var indice=eval("document.forms[0]."+idSelect_to_query+".selectedIndex");
if (indice == 0) { /* seleccion no valida */
eval( "document.forms[0]." + idSelect_to_modify + ".options.length=0");
}
else {
indice--;
/* borramos los options que pudieran haber de antes */
eval( "document.forms[0]." + idSelect_to_modify + ".options.length=0");
/* recorremos el vector de valores y creamos el select con los que se corresponden */
for (var i=0;i<=values[indice].length-1;i++) {
var aux = eval("opc" + i + "=new Option(\"" + values[indice][i] + " \", \" " + values[indice][i] + "\")");
eval( "document.forms[0]." + idSelect_to_modify + ".options[" + i + "]=aux");
}
}
}
</script>
</head>
<body>
<form name="form_name">
<select name="select_name01" onchange="create_select(name,'select_name02',combo_values02);">
<option>--------------</option>
<option>vehiculos</option>
<option>animales</option>
</select>
<select name="select_name02" onchange="create_select(name,'select_name05',combo_values03);">
</select>
<select name="select_name05">
</select>
<!--
<br>
<select name="select_name03" onchange="create_select(name,'select_name04',combo_values01);">
<option>--------------</option>
<option>colores claros</option>
<option>colores oscuros</option>
</select>
<select name="select_name04">
</select>
-->
</form>
</body>
</html>
Resulta que necesito montar 3 selects que dependen uno de otro en cascada. Para dos no hay problema, en la parte del codigo html comentado que pasteo al final de este comentario se puede ver. El problema es cuando tengo tres, de manera que el primero ejerce influencia sobre el segundo y el segundo sobre un tercero, ya que el tercero tiene que tener en cuanta tambien la seleccion que hay en el primero, ya que si no, como me ocurre a mi, se pueden seleccionar elementos perros de tipo scania... ;)
Cualqueir sugerencia sera superbienrecibida.
Muchas gracias por adelantado, de momento voy a seguir pensando a ver...
----
Para que quede mas claro lo que pretento se pude ver el ejemplo en: http://acad5084act.uji.es/test_combos.html.
---
El codigo es el siguiente:
<html>
<head>
<script language="javascript">
combo_values01 =[ ["-----","verde_claro","rojo_claro","azul_claro"],["-----","verde_oscuro","rojo_oscuro"] ];
combo_values02 =[ ["-----","camion","coche","moto","autobus"],["-----","perro","gato","mariposa","elefante","orangutan","serpiente"] ];
combo_values03 =[ ["-----","scania","pegasso"],["-----","seat","opel","ford"] ];
function create_select (idSelect_to_query,idSelect_to_modify,values) {
var indice=eval("document.forms[0]."+idSelect_to_query+".selectedIndex");
if (indice == 0) { /* seleccion no valida */
eval( "document.forms[0]." + idSelect_to_modify + ".options.length=0");
}
else {
indice--;
/* borramos los options que pudieran haber de antes */
eval( "document.forms[0]." + idSelect_to_modify + ".options.length=0");
/* recorremos el vector de valores y creamos el select con los que se corresponden */
for (var i=0;i<=values[indice].length-1;i++) {
var aux = eval("opc" + i + "=new Option(\"" + values[indice][i] + " \", \" " + values[indice][i] + "\")");
eval( "document.forms[0]." + idSelect_to_modify + ".options[" + i + "]=aux");
}
}
}
</script>
</head>
<body>
<form name="form_name">
<select name="select_name01" onchange="create_select(name,'select_name02',combo_values02);">
<option>--------------</option>
<option>vehiculos</option>
<option>animales</option>
</select>
<select name="select_name02" onchange="create_select(name,'select_name05',combo_values03);">
</select>
<select name="select_name05">
</select>
<!--
<br>
<select name="select_name03" onchange="create_select(name,'select_name04',combo_values01);">
<option>--------------</option>
<option>colores claros</option>
<option>colores oscuros</option>
</select>
<select name="select_name04">
</select>
-->
</form>
</body>
</html>
Valora esta pregunta
0