Ver Mensaje Individual
  #5 (permalink)  
Antiguo 04/04/2008, 15:23
Alberto_58
 
Fecha de Ingreso: marzo-2008
Mensajes: 7
Antigüedad: 16 años, 9 meses
Puntos: 0
Re: Select dependientes

Muchas gracias por responder

Pero por desgracia estoy muy muy verde en esto (he empezado hoy con Ajax).
Entiendo lo siguiente del enlace que me has dado:

1) TODO ESTO LO PONGO EN EL MISMO ARCHIVO PHP

El archivo "interpretadorAjax.js" lo incluyo así en el fichero PHP desde el cual quiero ejecutar código JavaScript y añado el código JavaScript de la opción b (que según el autor es el mejor):

<script type="text/javascript" src="interpretadorAjax.js"></script>

<script>
var scs=myAjax.responseText.extractScript(); //capturamos los scripts
myDivUoTroLugar.innerHTML=myAjax.responseText
scs.evalScript(); //ahora si, comenzamos a interpretar todo
</script>


<script type="text/javascript" src="select_dependientes.js"></script>

Este de arriba es el archivo que no pilla bien, aquí está la función "cargaContenido(idSelectOrigen)" que tiene el código JavaScript y las funciones "nuevoAjax()" y "buscarEnArray(array, dato)" que supongo que implementan AJAX.

.................................................. .................................................. ...........
.................................................. .................................................. ...........

Esta es la función que crea mi select para dar a elegir entre los cursos. Cuando cambio, se ejecuta la función "cargaContenido(this.id)".

function generaPaises() {

echo '<select name="cursos" id="cursos" onChange="cargaContenido(this.id)">';
echo '<option value="0">Elige un curso ahora</option>';

AQUÍ accedo a una base de datos MySql para obtener los cursos y añadirlos
}


2) CONTENIDO DE LA FUNCIÓN "cargaContenido".

function cargaContenido(idSelectOrigen)
{

// Obtengo la posicion que ocupa el select que debe ser cargado en el array declarado mas arriba
var posicionSelectDestino=buscarEnArray(listadoSelects , idSelectOrigen)+1;
// Obtengo el select que el usuario modifico
var selectOrigen=document.getElementById(idSelectOrige n);
// Obtengo la opcion que el usuario selecciono
var opcionSeleccionada=selectOrigen.options[selectOrigen.selectedIndex].value;
// Si el usuario eligio la opcion "Elige", no voy al servidor y pongo los selects siguientes en estado "Selecciona opcion..."
if(opcionSeleccionada==0)
{
var x=posicionSelectDestino, selectActual=null;
// Busco todos los selects siguientes al que inicio el evento onChange y les cambio el estado y deshabilito
while(listadoSelects[x])
{
selectActual=document.getElementById(listadoSelect s[x]);
selectActual.length=0;

var nuevaOpcion=document.createElement("option"); nuevaOpcion.value=0; nuevaOpcion.innerHTML="Selecciona Opci&oacute;n...";
selectActual.appendChild(nuevaOpcion); selectActual.disabled=true;
x++;
}
}
// Compruebo que el select modificado no sea el ultimo de la cadena
else if(idSelectOrigen!=listadoSelects[listadoSelects.length-1])
{
// Obtengo el elemento del select que debo cargar
var idSelectDestino=listadoSelects[posicionSelectDestino];
var selectDestino=document.getElementById(idSelectDest ino);
// Creo el nuevo objeto AJAX y envio al servidor el ID del select a cargar y la opcion seleccionada del select origen
var ajax=nuevoAjax();
ajax.open("GET", "select_dependientes_proceso.php?select="+idSelect Destino+"&opcion="+opcionSeleccionada, true);
ajax.onreadystatechange=function()
{
if (ajax.readyState==1)
{
// Mientras carga elimino la opcion "Selecciona Opcion..." y pongo una que dice "Cargando..."
selectDestino.length=0;
var nuevaOpcion=document.createElement("option"); nuevaOpcion.value=0; nuevaOpcion.innerHTML="Cargando...";
selectDestino.appendChild(nuevaOpcion); selectDestino.disabled=true;
}
if (ajax.readyState==4)
{
selectDestino.parentNode.innerHTML=ajax.responseTe xt;
}
}
ajax.send(null);
}
}

El otro select, el de los alumnos, lo tengo en otro archivo PHP que se llama "select_dependientes_proceso.php" que se llama desde esta función, lo he resaltado en negrita. A lo mejor os preguntáis por qué he tenido que usar Ajax y es que, para obtener la lista de alumnos asociados al curso necesito acceder a una base de datos MySql y no se puede hacer mediante JavaScript.