"sincronizar" menus select

ceronne · #1 (**permalink**) 09/01/2003, 22:11

porfa, el mensaje está aquí

http://www.forosdelweb.com/showthrea...hreadid=110726

Cita:

eso, como puedo hacer que mediante javascript y/o php se puedan sincronizar dos o mas menús select?

algo como esto...
http://www.geocities.com/naranja_negro/

pero si ven TODO se carga primero del lado del cliente y no quiero eso, me gustaría saber como le puedo hacer que cuando seleccionen una opción del primer menú se haga un refresh con los nuevos datos, claro después de haberse buscado con mysql (por esto no hay problema)... ¿xke no quiero que se carge todo de una vez??? porque mientras más datos en la BD haya, más tiempo se va a tardar en cargar la página... así que solo quiero tener las opciones necesarias. Otra cosa, si hay más campos en mi página por ejemplo del tipo text, no quiero que éstos se "borren" después del refresh... algo así como mantenerlos temporalmente.
muchas gracias por su ayuda....

KarlanKas · #2 (**permalink**) 10/01/2003, 05:15

A ver... en javascript se puede hacer algo parecido, a ver que te parece.

Lo que hacemos es crear varios archivos js con el contenido de los select. Uno por cada posible opción del select anterior. Y luego el código normal de la página.

Un ejemplo:

------------------------página.html---------------------------------

Código:

<html>
<head>
	<script>
	var valorDelPrimerSelect;
	var rangos=new Array;
	var posible=new Array;
	var pepe="<select name=segundo disabled size=1 style='font: bold 10px/14px; color: Navy; height: 30px;width:100px; background: #c5fde5;'>"
	rangos[0]=""
	rangos[1]="madrid";
	rangos[2]="logrono";
	rangos[3]="santander";
	rangos[4]="barcelona";
	rangos[5]="sevilla";
	rangos[6]="valencia";
	rangos[7]="oviedo";
	rangos[8]="alava";
	rangos[9]="zaragoza";
	rangos[10]="murcia";
		
	function segundos(){
	valorDelPrimerSelect=document.formulario.primero.value;
	
	opcioness.src=rangos[valorDelPrimerSelect] + ".js";

	
	for (a=0;a<posible.length;a++){
									pepe=pepe+"<option value="+posible[a]+">"+posible[a]+"</option>";
								  }
								  pepe=pepe+"</select>"
	segundo1.innerHTML=pepe;
	
	
	
	document.formulario.segundo.disabled=false;
	}
	
	
	</script>
	<script id="opcioness"></script>
</head>

<body>

<form action="" name="formulario">

<select name="primero" onchange="segundos()" size="1" style="font: bold 10px/14px; color: Navy; height: 30px; background: #eeeeee;">
	<option value="" SELECTED></option>
	<option value="1" >Uno</option>
	<option value="2">Dos</option>
	<option value="3">Tres</option>
	<option value="4">Cuatro</option>
	<option value="5">Cinco</option>
	<option value="6">Seis</option>
	<option value="7">Siete</option>
	<option value="8">Ocho</option>
	<option value="9">Nueve</option>
	<option value="10">Diez</option>
</select>

<div id="segundo1"></div>

</form>



</body>
</html>

y luego los archivos js. Te pongo el primero (el que corresponde a la opción 1)

---------madrid.js-------------------------------------------
posible[0]="Madrid";
posible[1]="Leganés";
posible[2]="Moratalaz";
posible[3]="Las Rozas";
posible[4]="Pozuelo";
posible[5]="Soto del Real";
posible[6]="Guadalix";
-------------------------------------------------------------

los guardas en el mismo directorio y me dices ahora que tal...

Kaopectate · #3 (**permalink**) 10/01/2003, 05:42

Muy buena solución Karlan. También quería decir que el FAQ-1 trata precisamente este punto aunque con menos elegancia.

Saludos.

KarlanKas · #4 (**permalink**) 10/01/2003, 05:46

Hola Kao!

El problema que tenía era que no quería cargar todas las opciones en la página HTML para no hacerla más pesada. De no ser así la tuya habría sido la más indicada.

Salu2!!!

Kaopectate · #5 (**permalink**) 10/01/2003, 05:56

Perfecto Karlan.

ceronne · #6 (**permalink**) 10/01/2003, 09:52

gracias, voy a probar

oigan, alguien sabe xke me causa error el browser cuando pongo un onchange??
lo pongo de lasig manera

onchange="location.href=http://bla bla bla.com/bla"

Kaopectate · #7 (**permalink**) 10/01/2003, 10:02

En lugar de hacerlo asi:

Código:

onchange="location.href=http://bla bla bla.com/bla"

Yo lo haría asi:

Código:

onchange="JavaScript:location.href='http://bla bla bla.com/bla'"

Claro, donde dice java script separado debes escribir javascript como una sola palabra.

Prueba y me dices.

Saludos.