Llevo mucho tiempo leyendo este foro porque es un tesoro para la comunidad programadora. Escribo muy poco porque intento siempre encontrar las soluciones por mi cuenta, pero esta vez os invoco para pediros ayuda con un maldito script en javascript que me tiene nervioso.
Veréis, el caso es muy simple:
Tengo un formulario. Si eliges un día de la semana, se cargan unos horarios, si eliges otro, pues se cargan otros horarios.
El script está hecho. Es el siguiente (por favor, haced copy & paste en un notepad para visualizar mejor el problema y guardarlo en archivo.html)
Cita:
Vale, ahora abrid el html con vuestro navegador favorito. El problema es el siguiente:<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
</head>
<SCRIPT>
function Combos(x)
{
ItDepend1=document.getElementById('CombDependiente 1');
ItDepend2=document.getElementById('CombDependiente 2');
ItDepend3=document.getElementById('CombDependiente 3');
ItDepend4=document.getElementById('CombDependiente 4');
if(!ItDepend1){return;}
if(!ItDepend2){return;}
if(!ItDepend3){return;}
if(!ItDepend4){return;}
var mitems=new Array();
var mitems_ids=new Array();
mitems['Triar']=[' '];
mitems['Tardor']=['Dia 1 - 09:00','Dia 1 - 11:30','Dia 2 - 09:00','Dia 2 - 11:30'];
mitems['Primavera']=['Dia 3 - 09:00','Dia 3 - 11:30','Dia 4 - 09:00','Dia 4 - 11:30'];
mitems['Tardor2']=['Dia 5 - 09:00','Dia 5 - 11:30','Dia 5 - 09:00','Dia 5 - 11:30'];
mitems['Primavera2']=['Dia 6 - 09:00','Dia 6 - 11:30','Dia 6 - 09:00','Dia 6 - 11:30'];
mitems_ids['Tardor']=['dia1a','dia1b','dia2a','dia2b','4'];
mitems_ids['Primavera']=['dia3a','dia3b','dia4a','dia4b','8'];
mitems_ids['Tardor2']=['dia5a','dia5b','dia5a','dia5b','4'];
mitems_ids['Primavera2']=['dia6a','dia6b','dia6a','dia6b','8'];
ItDepend1.options.length=0;
ItDepend2.options.length=0;
ItDepend3.options.length=0;
ItDepend4.options.length=0;
ItActual=mitems[x.options[x.selectedIndex].value];
ItActual_ids=mitems_ids[x.options[x.selectedIndex].value];
if(!ItActual){return;}
ItDepend1.options.length=ItActual.length;
ItDepend2.options.length=ItActual.length;
ItDepend3.options.length=ItActual.length+1;
ItDepend4.options.length=ItActual.length+1;
ItDepend3.options[0].text='SENSE ESCOLLIR';
ItDepend4.options[0].text='SENSE ESCOLLIR';
for(var i=0;i<ItActual.length;i++)
{
ItDepend1.options[i].text=ItActual[i];
ItDepend1.options[i].value=ItActual_ids[i];
ItDepend2.options[i].text=ItActual[i];
ItDepend2.options[i].value=ItActual_ids[i];
ItDepend3.options[i+1].text=ItActual[i];
ItDepend3.options[i+1].value=ItActual_ids[i];
ItDepend4.options[i+1].text=ItActual[i];
ItDepend4.options[i+1].value=ItActual_ids[i];
}
ItDepend1.options.length=1;
ItDepend2.options.length=1;
ItDepend3.options.length=1;
ItDepend4.options.length=1;
if(x.value == "Tardor"){
ItDepend1.options[0].text='DIA 1 - 09:00';
}else if(x.value == "Primavera"){
ItDepend1.options[0].text='DIA 3 - 09:00';
}else if(x.value == "Tardor2"){
ItDepend1.options[0].text='DIA 5 - 09:00';
}else if("Primavera2"){
ItDepend1.options[0].text='DIA 6 - 09:00';
}
if(x.value == "Tardor"){
ItDepend2.options[0].text='DIA 1 - 11:30';
}else if(x.value == "Primavera"){
ItDepend2.options[0].text='DIA 3 - 11:30';
}else if(x.value == "Tardor2"){
ItDepend2.options[0].text='DIA 5 - 09:00';
}else if("Primavera2"){
ItDepend2.options[0].text='DIA 6 - 09:00';
}
if(x.value == "Tardor"){
ItDepend3.options[0].text='DIA 2 - 09:00';
}else if(x.value == "Primavera"){
ItDepend3.options[0].text='DIA 4 - 09:00';
}else if(x.value == "Tardor2"){
ItDepend3.options[0].text='DIA 5 - 09:00';
}else if("Primavera2"){
ItDepend3.options[0].text='DIA 6 - 09:00';
}
if(x.value == "Tardor"){
ItDepend4.options[0].text='DIA 2 - 11:30';
}else if(x.value == "Primavera"){
ItDepend4.options[0].text='DIA 4 - 11:30';
}else if(x.value == "Tardor2"){
ItDepend4.options[0].text='DIA 5 - 09:00';
}else if("Primavera2"){
ItDepend4.options[0].text='DIA 6 - 09:00';
}
}
</SCRIPT>
<form>
<table>
<h2>Datos</h2>
<tr>
<td><label>Numero</label></td>
<td> <input type="text" name="alumnes1" id="alumnes" tabindex="8" /></td>
<td><label for="or">Dias</label></td>
<td><select name="or1" id="or1" onChange="Combos(this)">
<option value="Triar">Selecciona</option>
<option value=Tardor>Lunes</option><option value=Primavera>Viernes</option></select></td></tr><tr>
<td><label>Curso</label></td>
<td><select name="curs1" id="curs" tabindex="10">
<option value="selecciona" >Selecciona</option>
<option value="1rbtx" >1r BATX</option>
<option value="2nbtx" >2n BATX</option>
</select></td>
<td><label>Modalitat</label></td>
<td><select name="modalitat1" id="modalitat" tabindex="11">
<option value="noescollit" >Selecciona</option>
<option value="cietec" >Cientifico</option>
<option value="social" >Social</option>
</select></td>
</tr>
<tr>
<td> <select name="CombDependiente1" id="CombDependiente1"></select></td>
<td><select name="dia11gr1" id="modalitat" tabindex="11">
<option value="pref1" >preferencia 1</option>
<option value="pref2" >preferencia 2</option>
<option value="pref3" >preferencia 3</option>
<option value="pref4" >preferencia 4</option>
<option value="nopref" >No puedo</option>
</select></td>
<td> <select name="CombDependiente2" id="CombDependiente2" ></select></td>
<td> <select name="dia12gr1" id="modalitat" tabindex="11">
<option value="pref1" >preferencia 1</option>
<option value="pref2" >preferencia 2</option>
<option value="pref3" >preferencia 3</option>
<option value="pref4" >preferencia 4</option>
<option value="nopref" >No puedo</option>
</select></td>
</tr>
<tr>
<td> <select name="CombDependiente3" id="CombDependiente3" ></select></td>
<td> <select name="dia21gr1" id="modalitat" tabindex="11">
<option value="pref1" >preferencia 1</option>
<option value="pref2" >preferencia 2</option>
<option value="pref3" >preferencia 3</option>
<option value="pref4" >preferencia 4</option>
<option value="nopref" >No puedo</option>
</select></td>
<td> <select name="CombDependiente4" id="CombDependiente4" ></select></td>
<td> <select name="dia22gr1" id="modalitat" tabindex="11">
<option value="pref1" >preferencia 1</option>
<option value="pref2" >preferencia 2</option>
<option value="pref3" >preferencia 3</option>
<option value="pref4" >preferencia 4</option>
<option value="nopref" >No puedo</option>
</select></td>
</tr>
</table>
</form>
</table>
</body>
</html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
</head>
<SCRIPT>
function Combos(x)
{
ItDepend1=document.getElementById('CombDependiente 1');
ItDepend2=document.getElementById('CombDependiente 2');
ItDepend3=document.getElementById('CombDependiente 3');
ItDepend4=document.getElementById('CombDependiente 4');
if(!ItDepend1){return;}
if(!ItDepend2){return;}
if(!ItDepend3){return;}
if(!ItDepend4){return;}
var mitems=new Array();
var mitems_ids=new Array();
mitems['Triar']=[' '];
mitems['Tardor']=['Dia 1 - 09:00','Dia 1 - 11:30','Dia 2 - 09:00','Dia 2 - 11:30'];
mitems['Primavera']=['Dia 3 - 09:00','Dia 3 - 11:30','Dia 4 - 09:00','Dia 4 - 11:30'];
mitems['Tardor2']=['Dia 5 - 09:00','Dia 5 - 11:30','Dia 5 - 09:00','Dia 5 - 11:30'];
mitems['Primavera2']=['Dia 6 - 09:00','Dia 6 - 11:30','Dia 6 - 09:00','Dia 6 - 11:30'];
mitems_ids['Tardor']=['dia1a','dia1b','dia2a','dia2b','4'];
mitems_ids['Primavera']=['dia3a','dia3b','dia4a','dia4b','8'];
mitems_ids['Tardor2']=['dia5a','dia5b','dia5a','dia5b','4'];
mitems_ids['Primavera2']=['dia6a','dia6b','dia6a','dia6b','8'];
ItDepend1.options.length=0;
ItDepend2.options.length=0;
ItDepend3.options.length=0;
ItDepend4.options.length=0;
ItActual=mitems[x.options[x.selectedIndex].value];
ItActual_ids=mitems_ids[x.options[x.selectedIndex].value];
if(!ItActual){return;}
ItDepend1.options.length=ItActual.length;
ItDepend2.options.length=ItActual.length;
ItDepend3.options.length=ItActual.length+1;
ItDepend4.options.length=ItActual.length+1;
ItDepend3.options[0].text='SENSE ESCOLLIR';
ItDepend4.options[0].text='SENSE ESCOLLIR';
for(var i=0;i<ItActual.length;i++)
{
ItDepend1.options[i].text=ItActual[i];
ItDepend1.options[i].value=ItActual_ids[i];
ItDepend2.options[i].text=ItActual[i];
ItDepend2.options[i].value=ItActual_ids[i];
ItDepend3.options[i+1].text=ItActual[i];
ItDepend3.options[i+1].value=ItActual_ids[i];
ItDepend4.options[i+1].text=ItActual[i];
ItDepend4.options[i+1].value=ItActual_ids[i];
}
ItDepend1.options.length=1;
ItDepend2.options.length=1;
ItDepend3.options.length=1;
ItDepend4.options.length=1;
if(x.value == "Tardor"){
ItDepend1.options[0].text='DIA 1 - 09:00';
}else if(x.value == "Primavera"){
ItDepend1.options[0].text='DIA 3 - 09:00';
}else if(x.value == "Tardor2"){
ItDepend1.options[0].text='DIA 5 - 09:00';
}else if("Primavera2"){
ItDepend1.options[0].text='DIA 6 - 09:00';
}
if(x.value == "Tardor"){
ItDepend2.options[0].text='DIA 1 - 11:30';
}else if(x.value == "Primavera"){
ItDepend2.options[0].text='DIA 3 - 11:30';
}else if(x.value == "Tardor2"){
ItDepend2.options[0].text='DIA 5 - 09:00';
}else if("Primavera2"){
ItDepend2.options[0].text='DIA 6 - 09:00';
}
if(x.value == "Tardor"){
ItDepend3.options[0].text='DIA 2 - 09:00';
}else if(x.value == "Primavera"){
ItDepend3.options[0].text='DIA 4 - 09:00';
}else if(x.value == "Tardor2"){
ItDepend3.options[0].text='DIA 5 - 09:00';
}else if("Primavera2"){
ItDepend3.options[0].text='DIA 6 - 09:00';
}
if(x.value == "Tardor"){
ItDepend4.options[0].text='DIA 2 - 11:30';
}else if(x.value == "Primavera"){
ItDepend4.options[0].text='DIA 4 - 11:30';
}else if(x.value == "Tardor2"){
ItDepend4.options[0].text='DIA 5 - 09:00';
}else if("Primavera2"){
ItDepend4.options[0].text='DIA 6 - 09:00';
}
}
</SCRIPT>
<form>
<table>
<h2>Datos</h2>
<tr>
<td><label>Numero</label></td>
<td> <input type="text" name="alumnes1" id="alumnes" tabindex="8" /></td>
<td><label for="or">Dias</label></td>
<td><select name="or1" id="or1" onChange="Combos(this)">
<option value="Triar">Selecciona</option>
<option value=Tardor>Lunes</option><option value=Primavera>Viernes</option></select></td></tr><tr>
<td><label>Curso</label></td>
<td><select name="curs1" id="curs" tabindex="10">
<option value="selecciona" >Selecciona</option>
<option value="1rbtx" >1r BATX</option>
<option value="2nbtx" >2n BATX</option>
</select></td>
<td><label>Modalitat</label></td>
<td><select name="modalitat1" id="modalitat" tabindex="11">
<option value="noescollit" >Selecciona</option>
<option value="cietec" >Cientifico</option>
<option value="social" >Social</option>
</select></td>
</tr>
<tr>
<td> <select name="CombDependiente1" id="CombDependiente1"></select></td>
<td><select name="dia11gr1" id="modalitat" tabindex="11">
<option value="pref1" >preferencia 1</option>
<option value="pref2" >preferencia 2</option>
<option value="pref3" >preferencia 3</option>
<option value="pref4" >preferencia 4</option>
<option value="nopref" >No puedo</option>
</select></td>
<td> <select name="CombDependiente2" id="CombDependiente2" ></select></td>
<td> <select name="dia12gr1" id="modalitat" tabindex="11">
<option value="pref1" >preferencia 1</option>
<option value="pref2" >preferencia 2</option>
<option value="pref3" >preferencia 3</option>
<option value="pref4" >preferencia 4</option>
<option value="nopref" >No puedo</option>
</select></td>
</tr>
<tr>
<td> <select name="CombDependiente3" id="CombDependiente3" ></select></td>
<td> <select name="dia21gr1" id="modalitat" tabindex="11">
<option value="pref1" >preferencia 1</option>
<option value="pref2" >preferencia 2</option>
<option value="pref3" >preferencia 3</option>
<option value="pref4" >preferencia 4</option>
<option value="nopref" >No puedo</option>
</select></td>
<td> <select name="CombDependiente4" id="CombDependiente4" ></select></td>
<td> <select name="dia22gr1" id="modalitat" tabindex="11">
<option value="pref1" >preferencia 1</option>
<option value="pref2" >preferencia 2</option>
<option value="pref3" >preferencia 3</option>
<option value="pref4" >preferencia 4</option>
<option value="nopref" >No puedo</option>
</select></td>
</tr>
</table>
</form>
</table>
</body>
</html>
Cuando selecciono un día de la semana, se carga correctamente el horario. PERO, el horario , a nivel de código, se carga con el tag "select". Cuando cambio el tag select por el tag label, si escojo un día de la semana, ya no se carga el horario.
Queda feo que se cargue con el tag select porque en realidad no hay que escoger nada ahí porque son datos predefinidos. Y no entiendo por qué poniendo el tag label no lo carga y no hace nada el script.
Por favor, agradecería muchísimo vuestra ayuda, esto me mantiene en vilo.
Muchas gracias de antemano compañeros.