// items guarda los objetos Option (los items y valores) posibles del desplegable dinamico
var items=new Array();

// Items y valores valores del desplegable inicial
items["nada"] = new Array();
items["nada"][0] = new Option("Así no vale, debe indicar la opción deseada desde el primer desplegable","nada");

// Items y valores del desplegable si se selecciona la opcion "coches"
items["coches"] = new Array();
items["coches"][0] = new Option("Fiat","unfiat");
items["coches"][1] = new Option("Ferrari","unferrari");

// Items y valores del desplegable si se selecciona la opcion "motos"
items["motos"] = new Array();
items["motos"][0] = new Option("Bultaco","unabultaco");
items["motos"][1] = new Option("Montesa","unamontesa");
items["motos"][2] = new Option("Ducati","unaducati");

// Vemos si es Netscape
var ns = (navigator.appName.indexOf("Netscape") != -1) ? true:false;

function BorraDesplegable(desplegable){
	var total_items_actual=desplegable.options.length;
	for (var i=0;i<total_items_actual;i++){
		desplegable.options[i]=null;
	}
}
function RellenaDesplegable(desplegable_origen,desplegable_destino){
	// Si es Netscape tenemos que vaciar la lista
	if (ns){BorraDesplegable(desplegable_destino);}

	// tomamos la lista indicada
	var opcion_indicada=desplegable_origen.selectedIndex;
	var valor_opcion_indicada=desplegable_origen.options[opcion_indicada].value;

	// items que tiene esa opcion
	var total_items_destino=items[valor_opcion_indicada].length;

	// Numero de items de la nueva opcion
	desplegable_destino.length=total_items_destino;

	// Damos el valor y texto de cada item. 
	for (var i=0;i<total_items_destino;i++){
		desplegable_destino.options[i].value=eval('items["'+valor_opcion_indicada+'"][i].value');
		desplegable_destino.options[i].text=eval('items["'+valor_opcion_indicada+'"][i].text');
	}

	// Preseleccionamos por defecto la primera opcion de la lista
	desplegable_destino.options.selectedIndex=0;
	
}
</script>
</HEAD>
<BODY>
<font face="Arial" size="4"><B>Desplegables inteligentes</B></font>
<form name="miformulario">
Primer desplegable: <select name="opcion" OnChange="RellenaDesplegable(this.form.opcion,this.form.opcion2)">
<option value="nada">Seleccione una opcion</option>
<option value="coches">Coches</option>
<option value="motos">Motos</option>
</select> 
<script language="javascript" type="text/javascript">
// Netscape no adapta el tamaño de la caja asi que se la damos 
if (ns){
	document.write('<br><select name="opcion2" size=4 width=450>');
} else {
	document.write('<select name="opcion2">');
}
