nicht angemeldet
Hallo,
... Wenn's was übersichtlicheres gibt, wäre ich dankbar, sonst muß ich mir wohl was (gestalterisch)Anderes einfallen lassen.
Wolln mal schaun, ob Du das übersichtlicher findest.
es ginge auch einfacher, wenn dir eine statische Methode genügen würde.
Genau das steckt hier dahinter. Ich hab mal unter hotel-gut-hoeing.de auf der Buchungsseite in Abhängigkeit vom Zimmertyp die Bettenanzahl in DropDownlisten ausgefüllt. Allso vom Prinzip sowas, was Du auch planst.
Dabei sollte man daran denken, dass es auch user ohne JavaScript gibt.
Wer das auf der Seite durchspielen will, bitte dran denken, dass es eine Live-Buchungsmaske ist und die dritte Seite nicht mehr absenden. Das entsprechende Formular befindet sich auf Seite 2/3.
Hier nun die vereinfachten Ausschnitte aus dem Source der Seite:
Im Head:
<script language="JavaScript" TYPE="text/javascript">
function belegungslistefuellen() {
text_belegungliste = new Array(document.forms[0].elements["belegung"].length);
for (i=0;i<text_belegungliste.length;i++) {
text_belegungliste[i] = document.forms[0].elements["belegung"].options[i].text;
}
}
function belegungsaenderung() {
auswahlindex = document.forms[0].elements["typ"].selectedIndex;
anzahlloeschen = document.forms[0].elements["belegung"].length;
for (i=0;i<anzahlloeschen;i++) {
document.forms[0].elements["belegung"].options[0] = null;
}
neubelegungsanzahl = belegungssoll[auswahlindex].length;
for (i=0;i<neubelegungsanzahl;i++) {
neubelegungsindex = belegungssoll[auswahlindex][i];
document.forms[0].elements["belegung"].options[i] = new Option(text_belegungliste[neubelegungsindex], neubelegungsindex, false, false);
}
}
function vorbereitung() {
belegungssoll = new Array();
belegungssoll[0] = new Array("0","1");
belegungssoll[1] = new Array("0","1","2");
belegungssoll[2] = new Array("0","1","2");
belegungssoll[3] = new Array("0","1","2","3");
belegungslistefuellen();
belegungsaenderung();
}
</script>
Im Body:
<body ... onLoad="vorbereitung();">
<form ...>
<select size="1" onChange="belegungsaenderung()" name="typ">
<option value="0">Dependance</option>
<option value="1">Gutshaus</option>
<option value="2">Gesindehaus</option>
<option value="3">Appartement</option>
</select>
<select size="1" name="belegung">
<option value="0">Einzelzimmer</option>
<option value="1">Doppelzimmer</option>
<option value="2">Dreibettzimmer</option>
<option value="3">Vierbettzimmer</option>
</select>
...
</form>
Damit Du durchblickst:
Zunächst wird onLoad (also nach dem Laden der Seite) die Funktion vorbereitung() aufgerufen.
Wie gesagt, für user ohne Javascript enthält die zweite DropDown-Liste belegung zunächst einmal alle möglichen Werte.
Dem Array belegungssoll wird nun für jeden typ ein Array der Werte die bei Auswahl im Feld belegung angezeigt werden sollen zugewiesen.
Anschließend wird belegungslistefuellen() aufgerufen. Hier werden alle aktuellen Werte von belegung in eine Array text_belegungsliste[] eingelesen.
Mit dem Aufruf belegungsaenderung() wird die DropDown-Liste belegung mit der aktuellen Einstellung belegt (Funktion s. unten) und die Seite ist Startbereit für eine Auswahl.
Wenn der user nun eine Auswahl in der DropDown-Liste typ vornimmt (onChange) wird erneut die Funktion belegungsaenderung() aufgerufen. Hier erhält auswahlindex den Wert der gemachten Auswahl (typ). Der Variable anzahlloeschen wird die Anzahl der Einträge in der DropDown-Liste belegung übergeben und in der folgenden Schleife werden alle Einträge (<option>) entfernt (auf null gesetzt).
Nun wird in neubelegungsanzahl die Anzahl der neu einzublendenden Einträge (inneres Array von belegungssoll für die getroffenen Auswahl) ermittelt. In der anschließenden Schleife werden nun entsprechend der bei typ getroffenen Auswahl im Array belegungssoll[] hinterlegten indizes durchlaufen. Der jeweiliger Index der im Array text_belegungliste zwischengespeicherten Originaleinträge wird in neubelegungsindex eingetragen. Anschließend wird die DropDown-Liste belegung Eintrag für Eintrag (option) neu aufgebaut. Das JavaScript-Object Option hat bis zu vier Parameter Option([text[, value[, defaultSelected[, selected]]]]).
Ich hoffe das Du mit dieser Umfangreichen Erklärung in der Lage bist, Deine eigene DropDown-Liste mit entsprechenden Werten zu füllen.
Viel Erfolg
Hartmut