Que tal, hace tiempo encontre un script para combobox dependiente, y me gusto mucho, asi que le agregue el boton de submit, pero lo oculte para no darle continuar sin escoger las opciones. Luego, al ir escogiendo las diferentes opciones se va mostrando u ocultando segun sea el caso. Hasta ahi todo bien, el problema es que al dar click en la primera opcion de cada lista de opciones, (-Categoria- y -SubCategoria-) se habilita el boton.
Trate de corregir eso, pero la verdad no le encontre como, ya que se muy poquito o casi nada de javascript.
Ojala algun experto en JavaScript me pueda echar la mano, la verdad ya estoy bien desesperado con esto. De antemano Muchas Gracias.
Aqui el codigo JavaScript.
Código Javascript
:
Ver original// Primer combo box
data_1 = new Option("1", "1");
data_2 = new Option("2", "2");
// Segundo combo box
data_1_1 = new Option("11", "11");
data_1_2 = new Option("12", "12");
data_2_1 = new Option("21", "21");
data_2_2 = new Option("22", "22");
data_2_3 = new Option("23", "23");
data_2_4 = new Option("24", "24");
data_2_5 = new Option("25", "25");
// Tercer combo box
data_1_1_1 = new Option("111", "111");
data_1_1_2 = new Option("112", "112");
data_1_1_3 = new Option("113", "113");
data_1_2_1 = new Option("121", "121");
data_1_2_2 = new Option("122", "122");
data_1_2_3 = new Option("123", "123");
data_1_2_4 = new Option("124", "124");
data_2_1_1 = new Option("211", "211");
data_2_1_2 = new Option("212", "212");
data_2_2_1 = new Option("221", "221");
data_2_2_2 = new Option("222", "222");
data_2_3_1 = new Option("231", "231");
data_2_3_2 = new Option("232", "232");
// Cuarto combo box
data_1_1_1_1 = new Option("1111","1111")
data_2_2_1_1 = new Option("2211","2211")
data_2_2_1_2 = new Option("2212","2212")
// Otros Parametros
displaywhenempty=""
valuewhenempty=-1
displaywhennotempty="-SubCategoria-"
valuewhennotempty=0
function change(currentbox) {
numb = currentbox.id.split("_");
currentbox = numb[1];
i=parseInt(currentbox)+1
// Vacio todos los combo boxes siguiendo la actual.
while ((eval("typeof(document.getElementById(\"combo_"+i+"\"))!='undefined'")) &&
(document.getElementById("combo_"+i)!=null))
{
son = document.getElementById("combo_"+i);
/*
Se borran todas las opciones menos la primera (no esta permitido)
Esto es, cuando se selecciona una categoria del combo anterior, las que
ya se habian desplegado en el siguiente, se borran.
*/
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
}
// Se crea un String con el nombre base ("stringa"), ejemplo: "data_1_0"
// al que se agregara _0,_1,_2,_3 etc para obtener el nombre del combo box que se va a llenar.
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")
f1.continuar.style.display="block"; //Muestro el Boton cuando ya no hay mas combobox a mostrar.
if (i==currentbox) break;
i=i+1
}
// llenando el combo hijo ("son") Si es que existe.
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 "-SubCategoria-"
*/
if ((i==0) && eval("typeof("+stringa+"0)=='undefined'"))
{
if (eval("typeof("+stringa+"1)=='undefined'"))
{
eval("son.options[0]=new Option(displaywhenempty,valuewhenempty)")
f1.continuar.style.display="block"; //Muestro el Boton cuando no hay mas subcategorias aunque haya otro combobox.
}
else
{
eval("son.options[0]=new Option(displaywhennotempty,valuewhennotempty)")
f1.continuar.style.display="none"; //Oculto el Boton
f1.combo1.disabled=false
f1.combo1.style.display="block"
}
}
else
eval("son.options["+i+"]=new Option("+stringa+i+".text,"+stringa+i+".value)")
i=i+1
}
i=1
combostatus=''
cstatus=stringa.split("_")
while (cstatus[i]!=null)
{
combostatus=combostatus+cstatus[i]
i=i+1
}
return combostatus;
}
}
Aca el codigo Html.
Código HTML:
<html>
<head><title>combobox</title>
<script language="javascript" src="combobox.js"></script>
</head>
<body>
<form name="f1" method="post" action="resultado.php">
<select name="combo0" id="combo_0" onChange="change(this);" size="3">
<option value="0">-Categoria-</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
<br /><br />
<select name="combo1" id="combo_1" onChange="change(this)" size="6">
<option value="value1"> </option>
</select>
<br /><br />
<select name="combo2" id="combo_2" onChange="change(this);" size="5">
<option value="value1"> </option>
</select>
<br /><br />
<select name="combo3" id="combo_3" onChange="change(this);" size="6">
<option value="value1"> </option>
</select>
<br />
<input id="continuar" type="submit" value="Continuar" style="display:none">
</form>
</body>
</html>