Listas enlazadas

Tengo 2 listas y quiero enlazarlos entre si, pero no encuentro la función. Me explico, tengo una lista donde quiero que salga continentes, y en la otra según el continente que elija salga la lista de países de ese continente. Tengo mi base de datos con las tablas continente y países y están enlazadas.

1 Respuesta

Respuesta
1
Disculpa la demora pero estaba con la PC sin funcionar.
Te envío parte del articulo de www.elguruprogramador.com.ar
Lo primero que hacemos es construir las dos listas con los elementos correspondientes, la lista de los meses la llenamos con la primer opción que es la del primero trimestre dado que cuando cargue la página esta opción esta seleccionada por defecto.
<form name="formulario" method="post" action="">
<div align="center">Trimestre
<select name="trimestres" OnChange="cambiar()">
<option value="1er. Trimestre" selected>1er. Trimestre</option>
<option value="2do. Trimestre">2er. Trimestre</option>
<option value="3er. Trimestre">3er. Trimestre</option>
<option value="4to. Trimestre">4to. Trimestre</option>
</select>
Meses
<select name="meses">
<option value="Enero" selected>Enero</option>
<option value="Febrero">Febrero</option>
<option value="Marzo">Marzo</option>
</select>
</div>
</form>
Cabe destacar de este código que debemos respetar los nombres de los objetos dado que sino el JavaScript no funcionara, otra cosa a destacar es la declaración del evento 'OnChange' de la lista de trimestres, esta declaración hace que cada ves que cambie el elemento seleccionado se ejecute la función de JavaScript llamada 'cambiar()', veamos ahora que contiene esta función...
function cambiar()
{
var index=document.forms.formulario.trimestres.selectedIndex;
formulario.meses.length=0;
if(index==0) trimestre1();
if(index==1) trimestre2();
if(index==2) trimestre3();
if(index==3) trimestre4();
}
Esta y las demás funciones JavaScript van entre las etiquetas llamadas 'script' y las podemos ubicar en cualquier sector de la página, pero lo más apropiado es ponerlas dentro de las etiquetas 'head'.
<script language="JavaScript">
function cambiar()
.
.
.
</script>
Bueno, ahora si comentemos el código anterior, la primr linea de código declara la variable llamada 'index' y a su ves le asigna el valor del elemento seleccionado en la lista trimestres, el valor 0 corresponde al primer trimestre, el 1 al segundo y así hasta el 3 que corresponde al ultimo trimestre es decir el cuarto. Después la segunda linea de código asigna 0 al la propiedad length de la lista meses, esta propiedad maneja el numero de elementos que tiene esa lista, a ponerla a cero se borran todos los elementos de la lista meses. Luego siguen un grupo de if que evalúan la variable 'index', si esta es igual a cero va a la función 'trimestre1()', si es 1 va a la función 'trimestre2()' y si sucesivamente, ahora ¿qué hacen esta funciones? Simple, llenan la lista de meses por ejemplo 'trimestre1()' llena la lista meses con los primeros tres meses del año, veamos como...
function trimestre1(){
opcion0=new Option("Enero","Enero","defauldSelected");
opcion1=new Option("Febrero","Febrero");
opcion2=new Option("Marzo","Marzo");
document.forms.formulario.meses.options[0]=opcion0;
document.forms.formulario.meses.options[1]=opcion1;
document.forms.formulario.meses.options[2]=opcion2;
}
Aquí creamos 3 variables a las cuales les asignamos el objeto 'Option' creado mediante la palabra clave 'new', para crear un objeto del tipo 'Option' debemos especificar como mínimo 2 parámetros, el primero es el texto que aparecerá en la lista y el segundo es el 'listvalue' que tendrá dicho elemento. También existe un tercer parámetro opcional que sirve para especificar si el elemento esta seleccionado, si queremos que esto sea así debemos poner el tercer parámetro con el valor 'defauldSelected'.
Después de crear los objetos 'Option' debemos asignárselos a la lista de los meses. Las demás funciones son iguales a esta lo único que cambia son los valores de los meses, igual acá va el código de las otras funciones...
function trimestre2(){
opcion0=new Option("Abril","Abril","defauldSelected");
opcion1=new Option("Mayo","Mayo");
opcion2=new Option("Junio","Junio");
document.forms.formulario.meses.options[0]=opcion0;
document.forms.formulario.meses.options[1]=opcion1;
document.forms.formulario.meses.options[2]=opcion2;
}
function trimestre3(){
opcion0=new Option("Julio","Julio","defauldSelected");
opcion1=new Option("Agosto","Agosto");
opcion2=new Option("Septiembre","Septiembre");
document.forms.formulario.meses.options[0]=opcion0;
document.forms.formulario.meses.options[1]=opcion1;
document.forms.formulario.meses.options[2]=opcion2;
}
function trimestre4(){
opcion0=new Option("Octubre","Octubre","defauldSelected");
opcion1=new Option("Noviembre","Noviembre");
opcion2=new Option("Diciembre","Diciembre");
document.forms.formulario.meses.options[0]=opcion0;
document.forms.formulario.meses.options[1]=opcion1;
document.forms.formulario.meses.options[2]=opcion2;
}
El art. completo esta en http://www.elguruprogramador.com.ar/zonas/ver.asp?id=13

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas