Foros del Web » Programando para Internet » Javascript »

Combobox anidado

Estas en el tema de Combobox anidado en el foro de Javascript en Foros del Web. Hola, podríais darme una solución ?? Mi problema es largo, os explico el problema entero ;) Como haría tres combobox anidados ?... Mexplico: Estoy haciendo ...
  #1 (permalink)  
Antiguo 02/01/2004, 10:34
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Combobox anidado

Hola, podríais darme una solución ??

Mi problema es largo, os explico el problema entero ;)

Como haría tres combobox anidados ?...

Mexplico: Estoy haciendo una web sobre futbol, y tengo 2 ligas q se juegan el lunes y el martes, quisiera elegir el dia en un select, y q en otro me salieran las jornadas, cuando eligiera la jornada 'x' en el tercer select saldrían los equipos q juegan. Podéis Ayudarme ?

Elige dia ( Lunes, martes... )

Según el día q escojas te aparecen las jornadas ( 1, 2, 3... )

Y Según que jornada elijas te saldrán los equipos que juegan ese dia, esa jornada ( Juve, R.Madrid, Atl Pulpillo... )

Día:
-----------------------------
|____________|_\/_|

Jornada
-----------------------------
|____________|_\/_|

Equipo
-----------------------------
|____________|_\/_|


No leí las Faq!!, sorry... :P
__________________
..:: Fr@n!! ::..

Última edición por Alocao; 02/01/2004 a las 10:38
  #2 (permalink)  
Antiguo 03/01/2004, 10:17
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Cita:
No leí las Faq!!, sorry... :P
ok
  #3 (permalink)  
Antiguo 03/01/2004, 12:25
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Exclamación Perooo

Hola tunait, leí las faq, y el ejemplo que hay es para 2 combobox anidados... he intentado por mis medios hacerlo a mi forma, pero naa de naa, como sería con 3 combobox anidados ??? como expliqué en el otro mensaje:

Elijo Dia: Lunes o Martes

Según que dia escoja en el tercer combobox saldrán unos equipos u otros

En el segundo combobox elijo jornada y en el tercer combobox
después de filtrar por dia filtrar por jornada

Según que jornada escoja saldrán unos equipos u otros...

Puedes ayudarme tunait ??? :P thanks!!!
__________________
..:: Fr@n!! ::..
  #4 (permalink)  
Antiguo 03/01/2004, 12:41
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Es esta faq?

http://www.forosdelweb.com/showthrea...893#post319893
  #5 (permalink)  
Antiguo 03/01/2004, 16:29
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Mas bien...

Más bien, no, en lugar de ir a alguna parte ( link ) que en otro select me aparezcan otra serie de opciones

Select --> Select2 --> Select3

Dia --> Jornada --> Equipo

El mismo ejemplo pero sin link y un select más que dependa de Jornada y Dia, a ver si mexplico:

Select1 lo llamaremos Dia
Select2 lo llamaremos Jornada
Select3 lo llamaremos Equipo

Equipo depende de Dia y Jornada
Jornada depende de Dia

Ok ? Gracias por tu paciencia y ayuda
__________________
..:: Fr@n!! ::..

Última edición por Alocao; 03/01/2004 a las 16:31
  #6 (permalink)  
Antiguo 03/01/2004, 16:42
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
vale, pero mañana que tengo yá las neuronas fritas (las dos) que llevo un montón de horas aquí pegada

te haré un pequeño ejemplo con pocas opciones, yá añadirás tú las que necesites (eso si alguien no se adelanta y deja algún ejemplo yá listo )
  #7 (permalink)  
Antiguo 04/01/2004, 14:23
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Gracias Tunait
__________________
..:: Fr@n!! ::..
  #8 (permalink)  
Antiguo 05/01/2004, 11:01
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
Bueno, este ha sido (al fin) mi primer encuentro con el tema este de las listas dependientes.


Hice un ejemplo sencillo de dos opciones por opción. Creo que está bastante intuitivo y se necesitan pocas explicaciones.

Código:
<script language="javascript" type="text/javascript">
//Listas dependientes por tunait!
//http://javascript.tunait.com/
function slctr(texto,valor){
this.texto = texto
this.valor = valor
}
var herramientas=new Array()
herramientas[0] = new slctr('- -Herramientas- -')
herramientas[1] = new slctr("Jardín",'jardin')
herramientas[2] = new slctr("fontanería",'fontaneria')


var muebles=new Array()
muebles[0] = new slctr('- -Muebles- -')
muebles[1] = new slctr("Salón",'salon')
muebles[2] = new slctr("dormitorio",'dormitorio')

//*******Nietos*******************
var jardin = new Array()
jardin[0] = new slctr('- -Jardín- -')
jardin[1] = new slctr("podadora",null)
jardin[2] = new slctr("segadora" ,null)

var fontaneria = new Array()
fontaneria[0] = new slctr('- -Fontanería- -')
fontaneria[1] = new slctr("llave inglesa",null)
fontaneria[2] = new slctr("llave fija",null)


var salon = new Array()
salon[0] = new slctr('- -Salón- -')
salon[1] = new slctr("Mesa",null)
salon[2] = new slctr("silla" ,null)

var dormitorio = new Array()
dormitorio[0] = new slctr('- -Dormitorio- -')
dormitorio[1] = new slctr("cama",null)
dormitorio[2] = new slctr("mesita" ,null)


function slctryole(cual,donde){
if(cual.selectedIndex != 0){
	donde.length=0
	cual = eval(cual.value)
	for(m=0;m<cual.length;m++){
		var nuevaOpcion = new Option(cual[m].texto);
		donde.options[m] = nuevaOpcion;
		if(cual[m].valor != null){
			donde.options[m].value = cual[m].valor
			}
		else{
			donde.options[m].value = cual[m].texto
			}
		}
	}
}
</script>
<form name="form1" method="post" action="">
<select name="select" onchange="slctryole(this,this.form.select2)">
<option>- - Seleccionar - -</option>
<option value="herramientas">herramientas</option>
<option value="muebles">muebles</option>
</select>
<select name="select2" onchange="slctryole(this,this.form.select3)">
<option>- - - - - -</option>
</select>
<select name="select3">
<option>- - - - - -</option>
</select>
</form>

en el onchange de cada selector le pasas los siguientes parámetros:


onchange="slctryole(this,this.form.nombreDelSelectACambiar)"


Dime si te sirvió (lo he probado en explorer 5.0, mozilla 5.0 y NS 7.0)
  #9 (permalink)  
Antiguo 05/01/2004, 11:30
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Uoooo

Muchisimas gracias Tunait, ha sido perfecto!!!
__________________
..:: Fr@n!! ::..
  #10 (permalink)  
Antiguo 08/01/2004, 07:26
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Pregunta Y si...

Vuelvo a decirte lo mismo... muchisimas gracias por el ejemplo dado, me ha servido de mucha ayuda... pero llega mi última pregunta q me acaba de surgir...

¿ Y si quiero q dos selects dependan de uno de los primeros ?

Siguiendo con el ejemplo de los equipos...

Día:
-----------------------------
|____________|_\/_|

Jornada
-----------------------------
|____________|_\/_|

Equipo Casa
-----------------------------
|____________|_\/_|

Equipo Fuera
-----------------------------
|____________|_\/_|


Que "Equipo Casa" y "Equipo Fuera" dependan de Jornada

<form name="form1" method="post" action="">
<select name="select" onchange="slctryole(this,this.form.select2)">
<option>- - Seleccionar - -</option>
<option value="herramientas">herramientas</option>
<option value="muebles">muebles</option>
</select>
<select name="select2" onchange="slctryole(this,this.form.select3)" & onchange="slctryole(this,this.form.select4)" >
<option>- - - - - -</option>
</select>
<select name="select3">
<option>- - - - - -</option>
</select>
<select name="select4">
<option>- - - - - -</option>
</select>
</form>

Como lo haría para que se cambien 2 Selects a la vez ???

Gracias Tunait!!
__________________
..:: Fr@n!! ::..
  #11 (permalink)  
Antiguo 12/01/2004, 09:51
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Pregunta ¿?

Tunait estás ahí ??? Alguien me puede contestar ???
__________________
..:: Fr@n!! ::..
  #12 (permalink)  
Antiguo 12/01/2004, 09:54
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
ufa, no ví que habías dejado algo más

Supongo que no habrá problema, le echaré un ojo y te digo algo

  #13 (permalink)  
Antiguo 13/01/2004, 09:47
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Gracias Tunait, espero respuesta
__________________
..:: Fr@n!! ::..
  #14 (permalink)  
Antiguo 14/01/2004, 09:10
Avatar de tunait
Moderadora
 
Fecha de Ingreso: agosto-2001
Ubicación: Terok Nor
Mensajes: 16.805
Antigüedad: 22 años, 8 meses
Puntos: 381
me cachis que me ha hecho dar más gueltas que un tonto

pero yastá

ahí va... dime si necesitas explicoteaciones


<script language="javascript" type="text/javascript">
//Listas dependientes por tunait!
//http://javascript.tunait.com/
function slctr(texto,valor){
this.texto = texto
this.valor = valor
}
var herramientas=new Array()
herramientas[0] = new slctr('- -Herramientas- -')
herramientas[1] = new slctr("Jardín",'jardin/jardin2')
herramientas[2] = new slctr("fontanería",'fontaneria/fontaneria2')


var muebles=new Array()
muebles[0] = new slctr('- -Muebles- -')
muebles[1] = new slctr("Salón",'salon/salon2')
muebles[2] = new slctr("dormitorio",'dormitorio/dormitorio2')

//*******Nietos*******************
var jardin = new Array()
jardin[0] = new slctr('- -Jardín- -')
jardin[1] = new slctr("podadora",null)
jardin[2] = new slctr("segadora" ,null)

var fontaneria = new Array()
fontaneria[0] = new slctr('- -Fontanería- -')
fontaneria[1] = new slctr("llave inglesa",null)
fontaneria[2] = new slctr("llave fija",null)


var salon = new Array()
salon[0] = new slctr('- -Salón- -')
salon[1] = new slctr("Mesa",null)
salon[2] = new slctr("silla" ,null)

var dormitorio = new Array()
dormitorio[0] = new slctr('- -Dormitorio- -')
dormitorio[1] = new slctr("cama",null)
dormitorio[2] = new slctr("mesita" ,null)

/************* nietos 2 *************/

var jardin2 = new Array()
jardin2[0] = new slctr('- -Jardín2- -')
jardin2[1] = new slctr("podadora2",null)
jardin2[2] = new slctr("segadora2" ,null)

var fontaneria2 = new Array()
fontaneria2[0] = new slctr('- -Fontanería2- -')
fontaneria2[1] = new slctr("llave inglesa2",null)
fontaneria2[2] = new slctr("llave fija2",null)


var salon2 = new Array()
salon2[0] = new slctr('- -Salón2- -')
salon2[1] = new slctr("Mesa2",null)
salon2[2] = new slctr("silla2" ,null)

var dormitorio2 = new Array()
dormitorio2[0] = new slctr('- -Dormitorio2- -')
dormitorio2[1] = new slctr("cama2",null)
dormitorio2[2] = new slctr("mesita2" ,null)

function slctryole(cual,donde,donde2){
if(cual.selectedIndex != 0){
donde.length=0
cualb=cual.value.split('/')
cual2 = eval(cualb[0])
for(m=0;m<cual2.length;m++){
var nuevaOpcion = new Option(cual2[m].texto);
donde.options[m] = nuevaOpcion;
if(cual2[m].valor != null){
donde.options[m].value = cual2[m].valor
}
else{
donde.options[m].value = cual2[m].texto
}
}
if(donde2){
donde2.length=0
cual2 = eval(cualb[1])
for(m=0;m<cual2.length;m++){
var nuevaOpcion = new Option(cual2[m].texto);
donde2.options[m] = nuevaOpcion;
if(cual2[m].valor != null){
donde2.options[m].value = cual2[m].valor
}
else{
donde2.options[m].value = cual2[m].texto
}
}
}
}

}
</script>

</head>

<body bgcolor="#FFFFFF" text="#000000">
<form name="form1" method="post" action="">
<select name="select" onchange="slctryole(this,this.form.select2)">
<option>- - Seleccionar - -</option>
<option value="herramientas">herramientas</option>
<option value="muebles">muebles</option>
</select>
<select name="select2" onchange="slctryole(this,this.form.select3,this.fo rm.select4)">
<option>- - - - - -</option>
</select>
<select name="select3">
<option>- - - - - -</option>
</select>
<select name="select4">
<option>- - - - - -</option>
</select>
<input type="submit">
</form>

  #15 (permalink)  
Antiguo 14/01/2004, 10:02
 
Fecha de Ingreso: enero-2004
Ubicación: Bcn
Mensajes: 20
Antigüedad: 20 años, 3 meses
Puntos: 0
Eres mi diosa

Sencillamente, eres mi Diosa...

Gracias... mil y una Gracias +, me ha servido toooooodo, Si hay alguna duda de Php, estoy a tu entero servicio, aunke sé poco por eso ...



Ciaooooooo
__________________
..:: Fr@n!! ::..
  #16 (permalink)  
Antiguo 30/09/2007, 17:52
 
Fecha de Ingreso: septiembre-2007
Mensajes: 1
Antigüedad: 16 años, 6 meses
Puntos: 0
Re: Combobox anidado

bueno amigos mira me parece bueno ese codigo , pero quiero que me ayuden en algo deseo que al elegir en el ultima lista una de las opciones me lleve a una pagina web osea cada opcion de la ultima lista me lleve a una pagina web ya sean iguales o diferentes me entiendes lo que pasa que eso lo hara para poner videos en mi we digamos la primera listas tendra peliculas y musicales, la siguiente los artistas de los musicales si es que elegi eso y los estilos de las peeliculas (accion, drama, etc)si es que elegi pelicula y por ultimo en la ultima lista los nombres de los temas en el caso de musicales y en caso de peliculas los titulos pes me entienden y al elegir un titulo en la uultima lista se valla a un pagina me entienden espero me ayuden gracias
  #17 (permalink)  
Antiguo 18/01/2010, 11:12
Avatar de djcd  
Fecha de Ingreso: enero-2010
Ubicación: Localhost
Mensajes: 11
Antigüedad: 14 años, 3 meses
Puntos: 0
Respuesta: Combobox anidado

Hola Tunait!
Este script me pareció fantástico!, pero me quedé con una duda ¿como conectas con la base de datos?
Quizás la pregunta es obvia, pero soy recién nacido en Javascript.
Un saludo.
  #18 (permalink)  
Antiguo 18/01/2010, 13:52
Avatar de djcd  
Fecha de Ingreso: enero-2010
Ubicación: Localhost
Mensajes: 11
Antigüedad: 14 años, 3 meses
Puntos: 0
Respuesta: Combobox anidado

Ahora me dicen que no se puede conectar javascript con mysql, que malo.
  #19 (permalink)  
Antiguo 18/01/2010, 15:09
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 22 años, 2 meses
Puntos: 772
Respuesta: Combobox anidado

Hola djcd

Te recuerdo el aviso que había al final de este tema y que parece que no has leído.



Tema cerrado.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Tema Cerrado




La zona horaria es GMT -6. Ahora son las 21:54.