Hola
Yo lo suelo hacer de dos formas, suponiendo que tienes los valores en una base de datos:
* La primer, genero desde php un array javascript, y cuando un desplegable cambia con una funcion javascript modifico el contenido del segundo desplegable , con un ejemplo:
En este caso tengo familias y subfamilias, cuando cambio el desplegable de la familia se recarga la subfamilia:
Este es el codigo PHP para generar el array en javascript
Código PHP:
...
<script language="JavaScript">
var subfamilias = Array();
<?
// familias( id int(), cabecera int(), nombre varchar() )
// Las familias con cabecera = 0 son de nivel 1 (familias)
// Las familias con cabecera > 0 son de nivel 2 (subfamilias)
// cabecera contiene el id de la familia de nivel 1, solo en subfamilias.
$familiaActiva = "";
$qFam = mysql_query( "SELECT f2.id AS idfamilia, f1.id AS idsubfamilia, f1.nombre AS subfamilia
FROM familias f1, familias f2
WHERE f1.cabecera = f2.id
ORDER BY idfamilia, subfamilia" );
while( $rFam = mysql_fetch_array( $qFam ) ) {
if( $familiaActiva != $rFam["idfamilia"] ) {
$familiaActiva = $rFam["idfamilia"];
echo "\tsubfamilias[$familiaActiva] = Array();\n"; // En javascript hay que definir todos los arrays.
$x = 1;
}
echo "\tsubfamilias[$familiaActiva][".$x++."] = new Option('".$rFam["subfamilia"]."', ". $rFam["idsubfamilia"] ." );\n";
}
?>
</script>
...
Con este código Javascript cambio el contenido del desplegable:
Código PHP:
// El desplegable siempre lo inicializo con tamaño 1, ya que la primera
// opción es el texto "seleccione una familia"
<script language="JavaScript">
// - fam contiene el identificador de la familia seleccionada
// - subfam contiene el objeto "SELECT" de la subfamilia
function cambiaFamilia( fam, subfam ) {
if( fam > 0 ) {
subfam.disabled = false;
subfam.length = 1;
for ( x in subfamilias[fam] )
subfam.options[x] = subfamilias[fam][x];
} else {
subfam.length = 1;
subfam.disabled = true;
}
}
</script>
y por último quedaría la definición del objeto SELECT:
Código PHP:
Familia<br>
<select name="nFamilia" class="envio" onchange="cambiaFamilia(this.value, this.form.nSubfam, this.form.nuevafamilia)" >
<option value="0">- Seleccione una familia -</option>
<?
$qFam = mysql_query ( "SELECT * FROM familias WHERE cabecera = 0 ORDER BY nombre" ) or die (mysql_error());
while ( $rFam = mysql_fetch_array ( $qFam ) ) { ?>
<option value="<?=$rFam["id"]?>"><?=$rFam["nombre"]?></option>
<? } ?>
</select>
...
Subfamilia<br>
<select name="nSubfam" class="envio" id="subfamilia">
<option value="0">- Seleccione una subfamilia -</option>
</select>
Este código es copy-paste de una página que realicé hace unos días, espero que no te sirva de algo y no te lie mucho.
* El segundo método es recargando la página y realizando la consulta de nuevo con valores diferentes.
Si los datos no los tienes en ninguna base de datos, y los conoces todos, puedes utilizar, simplemente, el primer método.