obertroll: dropdown aus Java laden

An alle hilfsbereiten Mittmenschen!
Ich möchte in Abhängigkeit von einer vorher erzeugten  Variablen. Die Begriffe in einem Dropdown-Menü definieren.
Ein Menü sollte beinhalten: "Keine"; "eine Schublade" ; "zwei Schubladen" usw. Das alternativ-Menü: "Keine"; "Wandabstützung"; "ein Stützbein"; "zwei... usw.
Also entweder das eine oder das andere! Nicht alle Begriffe in einem Dropdown-Menü.
Bitte eine einfache Erklärung, bin Anfänger!
Danke für die Hilfestellung

  1. Hallo Obertroll,

    Ich möchte in Abhängigkeit von einer vorher erzeugten  Variablen. Die Begriffe in einem Dropdown-Menü definieren.
    Ein Menü sollte beinhalten: "Keine"; "eine Schublade" ; "zwei Schubladen" usw. Das alternativ-Menü: "Keine"; "Wandabstützung"; "ein Stützbein"; "zwei... usw.
    Also entweder das eine oder das andere! Nicht alle Begriffe in einem Dropdown-Menü.

    Verstehe ich Dich richtig?

    • Du baust die Seite per Java? Oder liegt die Variable erst zur Laufzeit der Website vor und das Menü muss per Javascript aufgebaut werden?
    • Es gibt nur zwei alternativen für ein DropDown-Menü? Also wenn Deine (Java) Variable beispielsweise false ist, soll Menü 1 und bei true Menü 2 angezeigt werden?

    Hartmut

    1. Hallo Obertroll,

      Ich möchte in Abhängigkeit von einer vorher erzeugten  Variablen. Die Begriffe in einem Dropdown-Menü definieren.
      Ein Menü sollte beinhalten: "Keine"; "eine Schublade" ; "zwei Schubladen" usw. Das alternativ-Menü: "Keine"; "Wandabstützung"; "ein Stützbein"; "zwei... usw.
      Also entweder das eine oder das andere! Nicht alle Begriffe in einem Dropdown-Menü.

      Verstehe ich Dich richtig?

      • Du baust die Seite per Java? Oder liegt die Variable erst zur Laufzeit der Website vor und das Menü muss per Javascript aufgebaut werden?
      • Es gibt nur zwei alternativen für ein DropDown-Menü? Also wenn Deine (Java) Variable beispielsweise false ist, soll Menü 1 und bei true Menü 2 angezeigt werden?

      Hartmut

      Hallo Hartmut
      Die Seite ist aufgebaut und in einem Menü wird die Vorauswahl getroffen. Der Inhalt des Dropdown soll bei dieser Vorauswahl festgelegt werden.
      Jetzt soll genau das Ablaufen was du als die Alternativen richtig verstanden hast. Allerdings nicht mit false und true, da es insgesamt 9 Varianten gibt. Aber die Zuordnung eines Wertes dürfte das geringste Problem sein. In allen Fällen ist beim Start der Seite der Hinweis zuerst die Vorauswahl und dann werden die Varianten angeboten.
      Alle Varianten beginnen mit:

      <option selected>bitte auswählen</option>

      und jetzt kämen die unterschiedlichen Menüs

      Der Obertroll

      1. Hallo Obertroll,

        ich wiederhole mich nochmal:
        Zu welchem Zeitpunkt soll das Menü mit den unterschiedlichen Menüpunkten gefüllt werden. Auf der Serverseite (per Java)?
        Oder ist die Überschrift nur irreführend?

        Die Seite ist aufgebaut und ...

        Oder liegt die Variable erst zur Laufzeit der Website vor?
        Soll heißen die Website ist fertig beim Benutzer im Browser und abhängig von einer Benutzerauswahl im Browser (Variable) soll das Menü jetzt angepasst werden (Javascript)?

        Vielleicht kopierst Du mal den Quellcode-Teil hierher in dem die Auswahl (Variable) stattfindet mit ein paar Zeilen darüber und darunter, wenn schon nicht der gesamte Quellcode?

        Hartmut

        1. Hallo Obertroll,

          ich wiederhole mich nochmal:
          Zu welchem Zeitpunkt soll das Menü mit den unterschiedlichen Menüpunkten gefüllt werden. Auf der Serverseite (per Java)?
          Oder ist die Überschrift nur irreführend?

          Die Seite ist aufgebaut und ...
          Oder liegt die Variable erst zur Laufzeit der Website vor?
          Soll heißen die Website ist fertig beim Benutzer im Browser und abhängig von einer Benutzerauswahl im Browser (Variable) soll das Menü jetzt angepasst werden (Javascript)?

          Vielleicht kopierst Du mal den Quellcode-Teil hierher in dem die Auswahl (Variable) stattfindet mit ein paar Zeilen darüber und darunter, wenn schon nicht der gesamte Quellcode?

          Hartmut

          Die Variable liegt erst zur Laufzeit der Website vor?
          Soll heißen die Website ist fertig beim Benutzer im Browser und abhängig von einer Benutzerauswahl im Browser (Variable) soll das Menü jetzt angepasst werden (Javascript)?
          Genau so meinte ich das!
          Hier wird die Vorauswahl getroffen:
          <option selected>keine</option>
                          <option value="SL_1-100">1</option>
                          <option value="SB_2-1-100">2</option>
                          <option value="SB_3-1-100">3</option>
          und in Abhängigkeit der Variablen=1  ..=2  ..=3 usw. sollen die Inhalte des zweiten Dropdown unterschiedlich sein

          obertroll

          1. Hallo,

            und in Abhängigkeit der Variablen=1  ..=2  ..=3 usw. sollen die Inhalte des zweiten Dropdown unterschiedlich sein

            vielleicht suchst du etwas wie

            http://aktuell.de.selfhtml.org/artikel/javascript/verkettete-auswahllisten/

            Gruß plan_B

            --
                 *®*´¯`·.¸¸.·
            1. Hallo,

              und in Abhängigkeit der Variablen=1  ..=2  ..=3 usw. sollen die Inhalte des zweiten Dropdown unterschiedlich sein

              vielleicht suchst du etwas wie

              http://aktuell.de.selfhtml.org/artikel/javascript/verkettete-auswahllisten/

              Gruß plan_B

              Danke für den Tipp.
              In meiner Anfrage weise ich darauf hin, dass ich Anfänger bin. Ich habe es mit dem SELFHTML-Beispiel durchgespielt. So ähnlich dachte ich mir das Ganze. Leider 'ne Nummer zu groß für mich. Wenn's was übersichtlicheres gibt, wäre ich dankbar, sonst muß ich mir wohl was (gestalterisch)Anderes einfallen lassen.
              Hab mir das jedenfalls gespeichert, vieleicht wenn ich 'nen Durchblickerlehrgang mache klappt's später mal mit dem Verständnis.

              8-(
              Obertroll

              1. Hallo,

                ... Wenn's was übersichtlicheres gibt, wäre ich dankbar, sonst muß ich mir wohl was (gestalterisch)Anderes einfallen lassen.

                es ginge auch einfacher, wenn dir eine statische Methode genügen würde. Für jede Untermenuegruppe könntest du ein eigenes <select> anlegen und diese per style="display:none" ausblenden. Und in Abhängigkeit deiner Variablen das passende select wieder anzeigen.

                Gruß plan_B

                --
                     *®*´¯`·.¸¸.·
                1. 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

                  1. 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

                    Das ist nachvollziehbar für mich, ich danke euch für die Tipps.
                    mit trolligem Dank euch beiden
                    Obertroll

              2. fürchte fast, Hartmuts Vorschlag wird vom TO übersehen ...

                Gruß plan_B

                --
                     *®*´¯`·.¸¸.·