listas desplegables dependientes + link - java
Publicado por sergio (2 intervenciones) el 20/04/2016 19:45:33
hola, me llamo sergio y me gustaria me ayuden un poco con este problemita que debe ser simple pero yo no se como hacerlo,
la idea es crear listas desplegables de 4 niveles con link a página estática.
1: la marca
2: año
3: modelo
4 combustible
resultado : link
ejemplo: http://www.moura.com.br/pt/qualsuabateria
muchas gracias aguardo su respuesta!!!
en este foro encontre un ejemplo pero solo tiene 2 niveles y me falta uno,
---------------------------------------------------------
---------------------
otro ejemplo que funciona bien pero me falta un campo y como nose como cargar uno más , al intentar agregar algo deja de funcionar,
------
la idea es crear listas desplegables de 4 niveles con link a página estática.
1: la marca
2: año
3: modelo
4 combustible
resultado : link
ejemplo: http://www.moura.com.br/pt/qualsuabateria
muchas gracias aguardo su respuesta!!!
en este foro encontre un ejemplo pero solo tiene 2 niveles y me falta uno,
---------------------------------------------------------
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" language="javascript">
var direccionesRoc=new Array();
var direccionesAca=new Array();
direccionesRoc[0]="rock1.htm";
direccionesRoc[1]="rock2.htm";
direccionesAca[0]="barroco.htm";
direccionesAca[1]="sigloxx.htm";
direccionesAca[2]="romantico.htm";
function direccion(form){
var selec = form.tipos.options;
var combo = form.estilo.options;
if (selec[1].selected == true){
document.form.action=direccionesRoc[combo.selectedIndex];
}if (selec[2].selected == true){
form.action=direccionesAca[combo.selectedIndex];
}/*Se puede quitar una vez vemos que funciona*/alert(form.action);
}function agregarOpciones(form)
{var selec = form.tipos.options;
var combo = form.estilo.options;
combo.length = null;
if (selec[0].selected == true)
{var seleccionar = new Option("Esperando selección");
combo[0] = seleccionar;
}if (selec[1].selected == true)
{var popular1 = new Option("Rock de los 90");
var popular2 = new Option("Rock de los 80");
combo[0] = popular1;
combo[1] = popular2;
}if (selec[2].selected == true)
{var academica1 = new Option("Musica del Barroco");
var academica2 = new Option("Musica del Siglo XX");
var academica3 = new Option("Música del Romantisismo");
combo[0] = academica1;
combo[1] = academica2;
combo[2] = academica3;
}}</script>
<title>listas</title><body>
<form name="ejemplo2" method="POST" target="_blank" action="">
<select name="tipos" onChange="agregarOpciones(this.form)">
<option value="">[seleccione una opción]</option>
<option value="musicapopular">Música Popular (Rock)</option>
<option value="musicaacademica">Música Académica</option>
</select>
<select name="estilo" onChange="direccion(this.form)">
<option value="">Esperando selección</option>
</select>
<input type="submit" value="Enviar"></form>
</body>
</html>
---------------------
otro ejemplo que funciona bien pero me falta un campo y como nose como cargar uno más , al intentar agregar algo deja de funcionar,
------
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<html>
<head>
<script language="JavaScript">
function addOpt(oCntrl, iPos, sTxt, sVal){
var selOpcion=new Option(sTxt, sVal);
eval(oCntrl.options[iPos]=selOpcion);
}function cambia(oCntrl){
switch (document.frm.pais.selectedIndex){
case 0:addOpt(oCntrl, 0, "Ciudad de México", "www.mexico.com");
addOpt(oCntrl, 1, "Monterrey", "www.monterrey.com");
addOpt(oCntrl, 2, "Guadalajara", "www.guadalajara.com");
break;
case 1:addOpt(oCntrl, 0, "Madrid", "www.madrid.com");
addOpt(oCntrl, 1, "Barcelona", "www.barcelona.com");
addOpt(oCntrl, 2, "San Sebastián", "www.sansebastian.com");
addOpt(oCntrl, 3, "azara", "http://www.nipley.com.ar/motogp");
break;
case 2:addOpt(oCntrl, 0, "Caracas", "www.caracas.com");
addOpt(oCntrl, 1, "Maracay", "www.maracay.com");
addOpt(oCntrl, 2, "Valencia", "www.valencia.com");
break;
}}</script>
</head>
<body>
<form name="frm">
<table border="0" width="482">
<tr>
<td width="25">
Pais
</td>
<td width="89">
<select name="pais" onChange="cambia(document.frm.ciudad)">
<option value="Mex">Mexico</option>
<option value="Esp">España</option>
<option value="Ven">Venezuela</option>
</select>
</td>
<td width="6">
</td>
<td width="44">
Ciudad
</td>
<td width="296">
<select name="ciudad" onChange="location.href=this.form.ciudad.options[this.form.ciudad.selectedIndex].value">
<option value="0" selected>Ciudad de México</option>
<option value="1">Monterrey</option>
<option value="2">Guadalajara</option>
</select> <input type="button" value="Ir a..." onClick="location.href=this.form.ciudad.options[this.form.ciudad.selectedIndex].value"></td>
</tr>
</table>
</form>
</body>
</html>
Valora esta pregunta
0