Nicht mehr ganz neu hier
Hallo zusammen.
Ich brauche Eure Hilfe beim Thema JavaScript.
Folgendes habe ich vor:
Es soll in einem Formular in einem Auswahlfeld (Select-Options) ein Tag (Montag-Freitag) auswählbar sein.
Daraufhin soll eine zweite Auswahl angezeigt werden, die je nach ausgewähltem Tag bestimmte Uhrzeiten anzeigt und bestimmte auch ausblendet.
Konkret sollen alle Uhrzeiten auswählbar sein, wenn es sich um Dienstag oder Donnerstag handelt.
Bei den anderen Wochentagen sollen alle Zeiten ab 14 Uhr nicht auswählbar sein.
Ruft man die Seite das erste mal auf bzw. nach einem Reload, soll nur das Auswahlfeld der Tage sichtbar sein mit dem Wert "- Tag waehlen -"
Nach Auswahl des Tages das zweite Feld mit den Uhrzeiten. Je nach Tag sollen bestimmte Uhrzeiten nicht anwählbar sein.
Der folgende Lösungsansatz funktioniert bestens im FF, Opera, und Chrome. Safari interessiert das JavaScript überhaupt nicht und beim InternetExplorer 6 wie 7 funktioniert zwar das anfängliche Ausblenden des zweiten Feldes, jedoch nicht das disablen der bestimmten Zeiten.
Habe jetzt stundenlang gegoogelt und alles an Tipps (onClick statt onChange, Cache mit META-Tags leeren, disable="disable" anstatt disable = true usw.) ausprobiert, allerdings ohne Erfolg.
Wichtig wäre in erster Linie für mich, dass das Ausblenden der Zeiten im IE funktioniert. in den anderen, abgesehen von Safari, geht's ja auch.
Wie schaffe ich es also, dass der IE mir die Auswahl der nichtzulässigen Zeiten ausblendet?
Eventuell sieht jemand von Euch eine Lösung.
Ich brauche Eure Hilfe beim Thema JavaScript.
Folgendes habe ich vor:
Es soll in einem Formular in einem Auswahlfeld (Select-Options) ein Tag (Montag-Freitag) auswählbar sein.
Daraufhin soll eine zweite Auswahl angezeigt werden, die je nach ausgewähltem Tag bestimmte Uhrzeiten anzeigt und bestimmte auch ausblendet.
Konkret sollen alle Uhrzeiten auswählbar sein, wenn es sich um Dienstag oder Donnerstag handelt.
Bei den anderen Wochentagen sollen alle Zeiten ab 14 Uhr nicht auswählbar sein.
Ruft man die Seite das erste mal auf bzw. nach einem Reload, soll nur das Auswahlfeld der Tage sichtbar sein mit dem Wert "- Tag waehlen -"
Nach Auswahl des Tages das zweite Feld mit den Uhrzeiten. Je nach Tag sollen bestimmte Uhrzeiten nicht anwählbar sein.
Der folgende Lösungsansatz funktioniert bestens im FF, Opera, und Chrome. Safari interessiert das JavaScript überhaupt nicht und beim InternetExplorer 6 wie 7 funktioniert zwar das anfängliche Ausblenden des zweiten Feldes, jedoch nicht das disablen der bestimmten Zeiten.
Habe jetzt stundenlang gegoogelt und alles an Tipps (onClick statt onChange, Cache mit META-Tags leeren, disable="disable" anstatt disable = true usw.) ausprobiert, allerdings ohne Erfolg.
Wichtig wäre in erster Linie für mich, dass das Ausblenden der Zeiten im IE funktioniert. in den anderen, abgesehen von Safari, geht's ja auch.
Wie schaffe ich es also, dass der IE mir die Auswahl der nichtzulässigen Zeiten ausblendet?
Eventuell sieht jemand von Euch eine Lösung.
Code:
function showhide(f,v){
var t = f.elements['zeit'];
if(v=='- Tag waehlen -'){t.style.visibility='hidden'}
else{t.style.visibility='visible'}
if((v=='Montag')||(v=='Mittwoch')||(v=='Freitag'))
{
document.getElementById("14").disabled = true;
document.getElementById("1430").disabled = true;
document.getElementById("15").disabled = true;
document.getElementById("1530").disabled = true;
document.getElementById("16").disabled = true;
document.getElementById("1630").disabled = true;
document.getElementById("17").disabled = true;
}
if((v=='Dienstag')||(v=='Donnerstag'))
{
document.getElementById("14").disabled = false;
document.getElementById("1430").disabled = false;
document.getElementById("15").disabled = false;
document.getElementById("1530").disabled = false;
document.getElementById("16").disabled = false;
document.getElementById("1630").disabled = false;
document.getElementById("17").disabled = false;
}
}
onload = function(){document.forms[0].elements['zeit'].style.visibility='hidden'}
HTML:
<select name="tag" onClick="showhide(this.form,this.value)">
<option>- Tag waehlen -</option>
<option>Montag</option>
<option>Dienstag</option>
<option>Mittwoch</option>
<option>Donnerstag</option>
<option>Freitag</option>
</select>
<select name="zeit" >
<option>9:00 Uhr</option>
<option>9:30 Uhr</option>
<option>10:00 Uhr</option>
<option>10:30 Uhr</option>
<option>11:00 Uhr</option>
<option>11:30 Uhr</option>
<option>12:00 Uhr</option>
<option id="14">14:00 Uhr</option>
<option id="1430">14:30 Uhr</option>
<option id="15">15:00 Uhr</option>
<option id="1530">15:30 Uhr</option>
<option id="16">16:00 Uhr</option>
<option id="1630">16:30 Uhr</option>
<option id="17">17:00 Uhr</option>
</select>