Habilitar y desabilitar <selects> segun lo que se escoge Luego, que al elegir la categoria, se habilite el siguiente select, y al elegir una subcategoria, que se habilite el siguiente select en caso de existir. Hasta ahi estoy bien. le puse la siguiente linea:
son.options.disabled=false
Lo que no se es como volverlos a desabilitar en caso de cambiar de opinion y escoger otra categoria en el primer select.
ojala algun experto en javascript me eche una manita. Pongo el codigo que tengo. Gracias.
Código PHP:
<html>
<head><title>Seleccion</title>
<script language="JavaScript" type="text/javascript">
<!--
// primer combo box
data_1 = new Option("1", "$");
data_2 = new Option("2", "$$");
// segundo combo box
data_1_1 = new Option("11", "-");
data_1_2 = new Option("12", "-");
data_2_1 = new Option("21", "--");
data_2_2 = new Option("22", "--");
data_2_3 = new Option("23", "--");
data_2_4 = new Option("24", "--");
data_2_5 = new Option("25", "--");
// tercer combo box
data_1_1_1 = new Option("111", "*");
data_1_1_2 = new Option("112", "*");
data_1_1_3 = new Option("113", "*");
data_1_2_1 = new Option("121", "*");
data_1_2_2 = new Option("122", "*");
data_1_2_3 = new Option("123", "*");
data_1_2_4 = new Option("124", "*");
data_2_1_1 = new Option("211", "**");
data_2_1_2 = new Option("212", "**");
data_2_2_1 = new Option("221", "**");
data_2_2_2 = new Option("222", "**");
data_2_3_1 = new Option("231", "***");
data_2_3_2 = new Option("232", "***");
// cuarto combo box
data_2_2_1_1 = new Option("2211","%")
data_2_2_1_2 = new Option("2212","%%")
// otros parametros
displaywhenempty="vacio"
valuewhenempty=-1
displaywhennotempty="-Elegir Subcategoria-"
valuewhennotempty=0
function change(currentbox) {
numb = currentbox.id.split("_");
currentbox = numb[1];
i=parseInt(currentbox)+1
//Vacio todas las combo box siguiendo a la actual
while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
(document.getElementById("combo_"+i)!=null)) {
son = document.getElementById("combo_"+i);
// Vacio todas las opciones excepto la primera ( No esta permitido )
for (m=son.options.length-1;m>0;m--) son.options[m]=null;
// Reseteo la primera opcion
son.options[0]=new Option(displaywhenempty,valuewhenempty)
i=i+1
}
// Ahora creo una string de nombre "base" ( "stringa" ), ejemplo. "data_1_0"
// a la cual aregare _0,_1,_2,_3 etc para obtener el nombre del combo box para llenarlo
stringa='data'
i=0
while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
(document.getElementById("combo_"+i)!=null)) {
eval("stringa=stringa+'_'+document.getElementById(\"combo_"+i+"\").selectedIndex")
if (i==currentbox) break;
i=i+1
}
// Llenando el combo "Hijo" ( son ) en caso de que este exista.
following=parseInt(currentbox)+1
if ((eval("typeof(document.getElementById(\"combo_"+following+"\"))!='undefined'")) &&
(document.getElementById("combo_"+following)!=null)) {
son = document.getElementById("combo_"+following);
stringa=stringa+"_"
i=0
while ((eval("typeof("+stringa+i+")!='undefined'")) || (i==0)) {
// Si no hay opciones, vacio la primera opcion del combo " Hijo " ( son )
// De lo contrario, pongo el mensaje "- seleccionar -"
if ((i==0) && eval("typeof("+stringa+"0)=='undefined'"))
if (eval("typeof("+stringa+"1)=='undefined'"))
eval("son.options[0]=new Option(displaywhenempty,valuewhenempty)")
else
eval("son.options[0]=new Option(displaywhennotempty,valuewhennotempty)")
else
eval("son.options["+i+"]=new Option("+stringa+i+".text,"+stringa+i+".value)")
son.options.disabled=false
i=i+1
}
//son.focus()
i=1
combostatus=''
cstatus=stringa.split("_")
while (cstatus[i]!=null) {
combostatus=combostatus+cstatus[i]
i=i+1
}
return combostatus;
}
}
// -->
</script>
</head>
<body>
<table align="center">
<form name="f1" method="post" action="verificar.php">
<select name="combo0" id="combo_0" onChange="change(this);" style="width:250px;">
<option value="value1">-Elegir Categoria-</option>
<option value="value2">1</option>
<option value="value3">2</option>
</select>
<br />
<select name="combo1" id="combo_1" onChange="change(this)" style="width:250px;" disabled>
<option value="value1"> </option>
</select>
<br />
<select name="combo2" id="combo_2" onChange="change(this);" style="width:250px;" disabled>
<option value="value1"> </option>
</select>
<br />
<select name="combo3" id="combo_3" onChange="change(this);" style="width:250px;" disabled>
<option value="value1"> </option>
</select>
<p align="center"><input type="submit" value="Continuar"></p>
</form>
</table>
</body>
</html>
. 
