Inai: Input kombiniert mit abhängiger Database

Hallo Leute,

Ich bin neu hier (naja im Forum) und neu im HTML5. Ich versuche zur Zeit zwei Input Felder zu erstellen die abhängig von einander sind. Das Heißt, ich habe in dem einen Input Feld eine Datenliste angebunden und das nächste Input Feld sollte vom ersten Abhängig sein, das heißt es soll je nachdem was ich im ersten Eingebe/auswähle etwas anderes zur auswahl anbieten (Man muss aber weiterhin die Möglichkeit haben es selber zu Editieren). Weiß einer wie das geht? Ich habe folgendes Programm im Internet gefunden und habe versucht das anzupassen leider ohne Erfolg:

<html>

    <body>
        <h2>Coose your Car</h2>
        <hr>
        Chooose Car Make:
        <form action="action_page.php" id="form1">
        <select id='slct1' name="slct1" onChange="populate('slct1','slct2')">
            <option value=""></option>
            <option value="Chevy">Chevy</option>
            <option value="Dodge">Dodge</option>
            <option value="Ford">Ford</option>
        </select>
        <hr>
        Chooose Car Make:
        <select id='slct2' name='slct2'>
        </select>
        <hr>
        <input type="submit" value="Submit">
        <input type="submit" formenctype="multipart/form-data" value="Submit as Multipart/form-data"></form>


        <script type="text/javascript">
            function populate(s1,s2){
                var s1= document.getElementById(s1);
                var s2= document.getElementById(s2);
                s2.innerHTML= "";
                if(s1.value === "Chevy"){
                    var optionArray= ["|","camaro|Camaro","corvett|Corvett","impala|Impala"];
                }
                else if(s1.value === "Dodge"){
                    var optionArray= ["|","avenger|Avenger","charger|Charger","neu|Neu"];
                }
                else if(s1.value === "Ford"){
                    var optionArray= ["|","blau|Blau","grün|Grün","blau|Blau"];
                }
                for(var option in optionArray){
                    var pair = optionArray[option].split("|");
                    var newOption= document.createElement("option");
                    newOption.value = pair[0];
                    newOption.innerHTML = pair[1];
                    s2.options.add(newOption);
                }
            }
        </script>
    </body>

Wäre für Hilfe echt dankbar.

LG

  1. Tach!

    Wäre für Hilfe echt dankbar.

    Wie lautet dein konkretes Problem? Was genau möchtest du wissen?

    dedlfix.

  2. @@Inai

    (Man muss aber weiterhin die Möglichkeit haben es selber zu Editieren).

    Das ist bei „corvett|Corvett“ wohl auch nötig.

    „Ich kaufe ein E.“

    LLAP

    --
    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
    1. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

      (Man muss aber weiterhin die Möglichkeit haben es selber zu Editieren).

      Das ist bei „corvett|Corvett“ wohl auch nötig.

      „Ich kaufe ein E.“

      Das ist doch ein Hybrid aus Corvette und Kadett. Wusstest Du das nicht? Corvett|Cordette

      Spirituelle Grüße
      Euer Robert
      robert.r@online.de

      --
      Möge der wahre Forumsgeist ewig leben!
    2. Hallo,

      „Ich kaufe ein E.“

      Ich hätte grad günstig ein "Ê" im Angebot, wolle kaufe?

      Gruß
      Kalk

  3. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

    Ich bin neu hier (naja im Forum) und neu im HTML5. Ich versuche zur Zeit zwei Input Felder zu erstellen die abhängig von einander sind. Das Heißt, ich habe in dem einen Input Feld eine Datenliste angebunden und das nächste Input Feld sollte vom ersten Abhängig sein, das heißt es soll je nachdem was ich im ersten Eingebe/auswähle etwas anderes zur auswahl anbieten (Man muss aber weiterhin die Möglichkeit haben es selber zu Editieren).

    Weiß einer wie das geht?

    Bevor wir da konkreten Code diskutieren, sollten wir über die unterschiedlichen Konzepte nachdenken, die es gibt.

    • mehrstufiges (Experten-)Formular - ohne JavaScript verwendbar, aktives Backend erforderlich
    • reine JavaScript-Lösung, kein aktives Backend erforderlich
    • CSS-Lösung, kein aktives Backend erforderlich, kein JavaScript erforderlich
    • Asynchronous JavaScript mit XML (AJAX), setzt am Client JavaScript und im Backend Scripting/Programmierung voraus

    Welchen Weg willst Du gehen?

    Da Du für die Auswertung von Formularen aber eigentlich immer ein aktives Backend (PHP. Perl, C-Programm,...) benötigst, würde ich diese Lösungen schon mal bevorzugen. Uneigentlich kann man sich die Auswahl ja auch per E-Mail schicken lassen :-O

    Spirituelle Grüße
    Euer Robert
    robert.r@online.de

    --
    Möge der wahre Forumsgeist ewig leben!
    1. Hallo, also nochmal: Ich möchte ein beschreibbares Input-Feld erzeugen, welches eine Autovervollständigungsfunktion hat. Diese Autovervollständigungsfunktion bekommt man, indem man eine Datenliste erstellt und sie mit dem Inputfeld verbindet. also sowas wie:

      <input type="text" id="iwas1" list="Data1">

      und dann ein zweites Inputfeld:

      <input type="text" id="iwas2" list="Data2">

      diese Autovervollständigung dieses zweiten Input Feldes soll abhängig vom Autovervollständigen des ersten Feldes sein. Sprich wenn ich im ersten Feld 'Farbe' wähle, soll mir das zweite Feld als Autovervollständigung die Farben rausgeben Wenn ich aber 'Hunde' wähle, dann soll es mir die Rassen rausgeben. Es soll aber halt die Möglichkeit bestehen bleiben, unabhängig von der Autovervollständigung was einzugeben bei dem Programm was ich gepostet hatte ging das nicht, das hat man angeklickt und kann nicht reinschreiben.

      Mir ist es grundsätzlich egal ob man das mit javascript oder css oder was anderem löst. Ich habe da leider noch zuwenig Ahnung in der Materie und es gibt sovieles zu lernen, deswegen möchte ich nur gerne eine Möglichkeit haben es in HTML5 darzustellen. wäre schön wenn mir da wer helfen könnte

      1. Hallo

        … Autovervollständigungsfunktion …

        was verstehst du unter „Autovervollständigungsfunktion“?

        ich verstehe darunter die automatische Vervollständigung einer Eingabe, also wenn ich "Co" eintippe, wird mir "rvette" vorgeschalgen.

        Gruß Jürgen

        1. Hallo

          … Autovervollständigungsfunktion …

          was verstehst du unter „Autovervollständigungsfunktion“?

          ich verstehe darunter die automatische Vervollständigung einer Eingabe, also wenn ich "Co" eintippe, wird mir "rvette" vorgeschalgen.

          Gruß Jürgen

          Hallo Jürgen, genau das mein ich. Dazu hat man aber noch einen Pfeil an der seite, den man anklicken kann, dann werden alle Daten ausgegeben die vervollständigt werden würden (man kann die da auch direkt auswählen, so eine art 'drop down menü'). Diese Autovervollständigung basiert auf Datenlisten die man erstellt. Ich wollte aber gerne, dass abhängig welches Wort man beim 1. input auswählt eine andere Liste zur autovervollständigung in dem 2. input Fenster angegeben wird

          Ich habe erst vor Kurzem generell mit Programierung angefangen, weswegen ich noch viele lücken habe. Es kann sein, dass dieses Problem trivial ist, aber für mich ist es im moment eine unüberwindbare Hürde

          1. Hallo

            was verstehst du unter „Autovervollständigungsfunktion“?

            ich verstehe darunter die automatische Vervollständigung einer Eingabe, also wenn ich "Co" eintippe, wird mir "rvette" vorgeschalgen.

            genau das mein ich. Dazu hat man aber noch einen Pfeil an der seite, den man anklicken kann, dann werden alle Daten ausgegeben die vervollständigt werden würden (man kann die da auch direkt auswählen, so eine art 'drop down menü').

            Das, also die Auswahl von Werten aus einem vorgegebenen Bereich, ist Aufgabe 1. Soweit ich dich verstanden habe, willst du aber auch abweichende Eingaben zulassen. Das wäre Aufgabe 2. Die Aufgabe 3 ist, abhängig von der Auswahl in Feld 1 die möglichen Werte in Feld 2 zu generieren.

            Wenn es ausschließlich darum geht, die Auswahl auf einen vorhandenen Wertebereich zu beschränken, ist ein Select die Wahl der Wahl. Das feld ist aufklappbar und auch optisch so gekennzeichnet, es ist aber keine von der Vorgabe abweichende Auswahl möglich.

            Will ich, dass auch eine von den Vorgaben abweichende Auswahl erfolgen kann, ist ein Input mit einer Datalist die richtige Wahl. Allerdings sieht man (im Firefox) nicht auf Anhieb, dass es dort etwas aufzuklappen gibt. Vermutlich ist dies die von dir benötigte Lösung für die Eingaben.

            Jetzt zur Abhängigkeit der Vorgaben in Feld 2 von der Eingabe in Feld 1.

            Das kann man, wie robert schreib, serverseitig durch abschicken der Eingabe in Feld 1 mit Auswertung und Bestückung des Feldes 2 erledigen, aber auch per JavaScript, indem die richtigen Daten nachgeladen werden (Ajax) oder bereits beim Laden der Seite mitgeliefert udn dann nur noch ausgewählt und in das feld eingefügt werden.

            Da können dir andere als ich aber besser helfen.

            Tschö, Auge

            --
            Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war. Terry Pratchett, “Wachen! Wachen!
            1. Hallo Auge,

              genau das weiß ich aber schon, also 1 und zwei. Was ich blauche ist die 3 und ich weiß nicht wie man das macht. Gibt es denn nicht irgendwie die Möglichkeit select mit input zu verbinden?

              1. Tach!

                genau das weiß ich aber schon, also 1 und zwei. Was ich blauche ist die 3 und ich weiß nicht wie man das macht. Gibt es denn nicht irgendwie die Möglichkeit select mit input zu verbinden?

                Nein, nicht mit den Mitteln von HTML. Dein Lösungsweg sollte sein, die Datalist entsprechend anzupassen, die du dem Folge-Input übergibst.

                dedlfix.

              2. Hallo

                genau das weiß ich aber schon, also 1 und zwei. Was ich blauche ist die 3 und ich weiß nicht wie man das macht. Gibt es denn nicht irgendwie die Möglichkeit select mit input zu verbinden?

                Wie oft denn noch, ja. Welche Möglichkeiten es gibt, hat dir Robert – natürlich ohne die Einzelheiten – bereits aufgelistet. Welche davon du wählst bzw. überhaupt wählen kannst, liegt an den Möglichkeiten, die du auf deinem Server hast (serversetige Programmiersprachen) und an dem Szenario, in dem das Formular eingesetzt wird (Intranet einer Firma mit Kenntnis der eingesetzten Software (z.B. nur Desktopbrowser), Internet, muss zugänglich für jegliche Browsersoftware sein).

                Das sind Informationen, die du uns nennen musst, um von uns eine zielführende Hilfe bekommen zu können. Ansonsten bieten sich (spekulativ) fünf Wege an, von denen dreieinhalb in's Nichts führen.

                Tschö, Auge

                --
                Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war. Terry Pratchett, “Wachen! Wachen!
            2. @@Auge

              Will ich, dass auch eine von den Vorgaben abweichende Auswahl erfolgen kann, ist ein Input mit einer Datalist die richtige Wahl.

              Da hatte ich kürzlich eine Unterhaltung mit dem Schepp zu.

              LLAP

              --
              „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
        2. @@JürgenB

          ich verstehe darunter die automatische Vervollständigung einer Eingabe, also wenn ich "Co" eintippe, wird mir "rvette" vorgeschalgen.

          Und wenn du "vo" eintippst, wird "rgeschalgen" vorgeschalgen. SCNR.

          LLAP

          --
          „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
          1. Hallo,

            – vorgeschalgen …

            ich vermisse die Rechtschreibprüfung. :(

            Gruß Jürgen

            1. Tach!

              ich vermisse die Rechtschreibprüfung. :(

              Die musst du in deinem Browser anschalten.

              dedlfix.

              1. Hallo dedlfix,

                ich vermisse die Rechtschreibprüfung. :(

                Die musst du in deinem Browser anschalten.

                ich weiß, aber auf der Arbeit geht das nicht, und zu Hause hat es nicht geklappt.

                Gruß Jürgen

                1. Hallo

                  ich vermisse die Rechtschreibprüfung. :(

                  Die musst du in deinem Browser anschalten.

                  ich weiß, aber auf der Arbeit geht das nicht, und zu Hause hat es nicht geklappt.

                  noch mal versucht und jetzt hat es geklappt. :)

                  Gruß Jürgen

      2. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

        also nochmal: Ich möchte ein beschreibbares Input-Feld erzeugen, welches eine Autovervollständigungsfunktion hat.

        +------------+
        |            |
        +------------+
        +------------+
        | EINS       |.......................................................+
        | ZWEI       |...................................+                   |
        | DREI       |...............+                   |                   |
        +------------+               |                   |                   |
                                     v                   v                   v
                              +------------+       +------------+      +------------+         
                              |            |       |            |      |            |
                              +------------+       +------------+      +------------+
                              +------------+       +------------+      +------------+             .
                              | Hund       |.......................................................+
                              | Katze      |...................................+                   |
                              | Wurm       |...............+                   |                   |
                              +------------+               |                   |                   |
                                                           v                   v                   v
        
        

        Diese Autovervollständigungsfunktion bekommt man, indem man eine Datenliste erstellt und sie mit dem Inputfeld verbindet.

        also sowas wie:

        <input type="text" id="iwas1" list="Data1">

        Ich habe Dich schon verstanden.

        Aber Du musst nun ja auch die zweite Liste (hier mit Hund, Katze, Wurm) auswählen, wenn in der ersten 'DREI' gewählt wurde. Also muss die ID der zweiten Liste an den Wert der esten Liste gekoppelt werden.

        Und ich habe Dich nun gefragt, wie deine Strategie sein soll. Willst Du alle verfügbaren Listen bereits beim Initial-Request in der response zur Verfügung stellen? Das könnte bei größeren Projekten exponentiell wachsen.

        Oder willst Du eine irgendwie vom Backend aus gesteuerte Lösung wählen?

        Die Möglichkeit mit CSS geht übrigens noch nicht - soweit ich weiß. Das war eher eine Aufforderung an Gunnar, mir zu widersprechen ;-P

        Spirituelle Grüße
        Euer Robert
        robert.r@online.de

        --
        Möge der wahre Forumsgeist ewig leben!
        1. Hey,

          also ich weiß nicht was mit 'backend' gemeint ist. Was ich nicht will, ist dass alle Lösungen gleich zu Beginn angezeigt werden, sie sollen wie erwähnt nur spezifisch gewählt werden. Ich möchte das einfach normal für den Browser. Falls mit Backend gemeint ist, dass die Lösungen nur dann angezeigt werden, wenn das andere schon gewählt ist, dann ist es genau das was ich gerne hätte.

          nur so:

          mehrstufiges (Experten-)Formular - ohne JavaScript verwendbar, aktives Backend erforderlich (<-- ich hab keine Ahnung was das sein soll)

          reine JavaScript-Lösung, kein aktives Backend erforderlich (<- das wäre glaube ich das was ich mit dem Select habe oder?)

          CSS-Lösung, kein aktives Backend erforderlich, kein JavaScript erforderlich (<- wie soll das mit CSS gehen? ich dachte CSS ist nur da um das äußere zu Optimieren)

          Asynchronous JavaScript mit XML (AJAX), setzt am Client JavaScript und im Backend Scripting/Programmierung voraus (<-... lol .... -.-)

          Also nochmal, ich habe genade erst überhaupt angefangen mit HTML anzueignen, jede Seite bringt zu Beginn einem was anders bei. Hier habe ich das mit dem CSS gelernt. Ich kenne so einige Begriffe nicht und weiß nicht mal einen Bruchteil von dem was man mit HTML alles anstellen kann, oder welche anderen Programmiersprachen man braucht um in HTML richtig programmieren zu können. Mir ist bewusst das das wohl blöd kommt und man sich das von Anfang an aneignen sollte (und ich habe es versucht mir von Grund auf anzueignen) aber ab irgendeinem gewissen Punkt braucht man Wissen, welches auf keine der Anfängerseiten euínem gezeigt wird. Was ich brauche ist irgendeine Codezeile die mir bei der Lösung helfen könnte, das implementieren mache ich lieber selber, damit ich die Zeile auch verstehen lerne

          1. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

            also ich weiß nicht was mit 'backend' gemeint ist.

            Darf ich für Dich bei Wikipedia nachschlagen?

            Was ich nicht will, ist dass alle Lösungen gleich zu Beginn angezeigt werden, sie sollen wie erwähnt nur spezifisch gewählt werden.

            Das habe ich ja in der Pseudo-Grafik angedeutet.

            Ich möchte das einfach normal für den Browser.

            Das verstehe ich jetzt wieder nicht. Wir sind in einem Internet-Forum. Da gehe ich davon aus, dass das Frontend meinstens ein Browser ist.

            Falls mit Backend gemeint ist, dass die Lösungen nur dann angezeigt werden, wenn das andere schon gewählt ist, dann ist es genau das was ich gerne hätte.

            Wichtiger ist die Frage, was an Daten bereits beim Initial-Request, also als Reaktion auf den ersten AUfruf der Ressource, als Antwort an das Frontend (den Browser) gesendet werden soll. Bei drei Stufen à 10 Auswahlmöglichkeiten wären das bereits 1-10-100 -> also 111 Datentabellen. Oder sollen die Tabellen im Backend (Server, Skript) zusammengestellt werden, je nachdem, was man im Frontend (Browser) gerade ausgewählt hat?

            mehrstufiges (Experten-)Formular - ohne JavaScript verwendbar, aktives Backend erforderlich (<-- ich hab keine Ahnung was das sein soll)

            reine JavaScript-Lösung, kein aktives Backend erforderlich (<- das wäre glaube ich das was ich mit dem Select habe oder?)

            Eine reine JavaScript-Lösung erfordert aber die Übertragung der "111" Tabellen schon bei Aufruf der Ressource. Die kann sich der User dann auch im Quelltext alle ansehen.

            Asynchronous JavaScript mit XML (AJAX), setzt am Client JavaScript und im Backend Scripting/Programmierung voraus (<-... lol .... -.-)

            Was gibt es da zu lachen?

            Also nochmal, [...]

            ... genau! Zuerst die Begriffe klären, dann die Inhalte der Diskussion, dann sichten und auswählen, dann Lösungsansätze (mit Skripten) diskutieren.

            Spirituelle Grüße
            Euer Robert
            robert.r@online.de

            --
            Möge der wahre Forumsgeist ewig leben!
          2. Hallo Inai,

            als Anregung hier mal ein Link zu einem alten Selfhtml-Artikel. Da werden zwar Klapp-Menüs verwendet, aber fürs Prinzip sollte es reichen. Mein Suchstichwort war "verkettete Auswahlliste".

            Gruß Jürgen

            1. Hallo JürgenB,

              als Anregung hier mal ein Link zu einem alten Selfhtml-Artikel

              … den es auch im wiki gibt und der jetzt noch besser mit dem Stichwort „verkettete Auswahllisten“ gefunden wird.

              Bis demnächst
              Matthias

              --
              Signaturen sind bloed (Steel) und Markdown ist mächtig.
              1. Hallo Matthias,

                … den es auch im wiki gibt und der jetzt noch besser mit dem Stichwort „verkettete Auswahllisten“ gefunden wird.

                ich habe beim alten Artikel keinen Link zur Wiki-Version gefunden und dachte daher, das er noch nicht übertragen ist. Beim nächsten Mal also auch im Wiki suchen.

                Gruß Jürgen

                1. Hallo JürgenB,

                  ich habe beim alten Artikel keinen Link zur Wiki-Version gefunden und dachte daher, das er noch nicht übertragen ist.

                  So hätte ich bestimmt auch gedacht, ich war mir aber relativ sicher, dass es den Artikel schon in der neuen Dokumentation gibt.

                  Beim nächsten Mal also auch im Wiki suchen.

                  Ich habe dedlfix gebeten, eine 301 einzurichten.

                  Bis demnächst
                  Matthias

                  --
                  Signaturen sind bloed (Steel) und Markdown ist mächtig.
          3. Ich habs fürs erste aufgegeben das so zu machen wie ich es gerne hätte und es so gemacht wie ihr es vorgeschlagen habt. Ich denke mal sobald ich mich hiermit besser auskenne werde ich das auch von alleine machen können, Danke euch für die Wiki-Seiten

            Habs also nun mit <section> statt <datalist> gemacht

        2. Hallo robertroth,

          +------------+
          |            |
          +------------+
          +------------+
          | EINS       |.......................................................+
          | ZWEI       |...................................+                   |
          | DREI       |...............+                   |                   |
          +------------+               |                   |                   |
                                       v                   v                   v
          …
          

          Das wäre doch ein schöner Anwendungsfall für das Bilderhochladen. Krickel-Krackel mit irgendeinem Programm, speichern und hochladen.

          Bis demnächst
          Matthias

          --
          Signaturen sind bloed (Steel) und Markdown ist mächtig.
          1. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

            Hallo robertroth,

            +------------+
            |            |
            +------------+
            +------------+
            | EINS       |.......................................................+
            | ZWEI       |...................................+                   |
            | DREI       |...............+                   |                   |
            +------------+               |                   |                   |
                                         v                   v                   v
            …
            

            Das wäre doch ein schöner Anwendungsfall für das Bilderhochladen. Krickel-Krackel mit irgendeinem Programm, speichern und hochladen.

            Genau, ggf. auch guter alter Buntstifte-Kasten und scannen...

            Hier noch ein Tipp an den/die (OP|TO):

            onChange="getElementById('version').setAttribute('list', 'IE-version');"
            

            Das nimmt Bezug auf meinen Hinweis aus dem Krickel-Krackel-Post: "Also muss die ID der zweiten Liste an den Wert der esten Liste gekoppelt werden."

            Das "onChange()" steht hier jetzt nur exemplarisch dafür. wie man das mal schnell ausprobieren kann, ob sich was tut ;-)

            Man kann sich also eine Universalfunktion in JavaScript schreiben, die das Attribut "list" des nächsten Feldes in der Ausawahlkette setzt. Allerdings darf man auch nicht vergessen, die weiteren Folgefelder in der Kette ggf. zurückzusetzen.

            Spirituelle Grüße
            Euer Robert
            robert.r@online.de

            --
            Möge der wahre Forumsgeist ewig leben!
            1. @@robertroth

              Genau, ggf. auch guter alter Buntstifte-Kasten und scannen...

              Ein Stift reicht. Spart das Scannen.

              LLAP

              --
              „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
            2. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

              Hier noch ein Tipp an den/die (OP|TO):

              onChange="getElementById('version').setAttribute('list', 'IE-version');"
              

              oder als nächster Gedankenschritt:

              <input type="search" name="data[browserlist]" list="browsers" autocomplete="off" onBlur="getElementById('version').setAttribute('list', this.value + '-version'); alert(this.value + '-version');">
              

              erste Liste: browserlist
              zweite Listengruppe: version (es gibt also für jeden Browser eine Liste mit den Versionen) und die heißen dann so wie die Auswahl + '-version'

              Das alert() habe ich mal drin gelassen zur Kontrolle.

              Man muss sicherlich noch beachten, dass die Optionen dann gewissen Formvorschriften genügen müssen, damit sie als Argument in list zulässig sind.

              Spirituelle Grüße
              Euer Robert
              robert.r@online.de

              --
              Möge der wahre Forumsgeist ewig leben!
  4. @@Inai

    Das hört sich für mich an wie das Gruppieren von Optionen:

    <select name="month">
    	<optgroup label="Spring">
    		<option>March</option>
    		<option>April</option>
    		<option>May</option>
    	</optgroup>
    	<optgroup label="Summer">
    		<option>June</option>
    		<option>July</option>
    		<option>August</option>
    	</optgroup>
    	<optgroup label="Fall">
    		<option>September</option>
    		<option>October</option>
    		<option>November</option>
    	</optgroup>
    	<optgroup label="Winter">
    		<option>December</option>
    		<option>January</option>
    		<option>February</option>
    	</optgroup>
    </select>
    

    Spring, Summer, Fall, Winter sind keine Optionen, die man auswählen möchte; sondern Label, bei denen das jeweilige Unterauswahlmenü erscheinen soll.

    Gab es nicht mal Browser, die das so gerendert haben?

    ┌────────────┐
    │ Spring   ► │
    ├────────────┤
    │ Summer   ► │
    ├──────────┬─┴──────────┐
    │ Fall     │ September  │
    ├──────────┼────────────┤
    │ Winter   │ October    │
    └──────────┼────────────┤
               │ November   │
               └────────────┘
    

    Heutzutage wird das von Browsern wohl üblicherweise so gerendert:

    ┌────────────┐
    │ Spring     │
    ├────────────┤
    │   March    │
    ├────────────┤
    │   April    │
    ├────────────┤
    │   May      │
    ├────────────┤
    │ Summer     │
    ├────────────┤
    │   June     │
    ├────────────┤
    │   July     │
    ├────────────┤
    │   August   │
    ├────────────┤
    │ Fall       │
    ├────────────┤
    │   September│
    ├────────────┤
    │   October  │
    ├────────────┤
    │   November │
    ├────────────┤
    │ Winter     │
    ├────────────┤
    │   December │
    ├────────────┤
    │   January  │
    ├────────────┤
    │   February │
    └────────────┘
    

    Schade eigentlich.

    LLAP

    --
    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
    1. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

      Das hört sich für mich an wie das Gruppieren von Optionen:

      <select multiple name="month">
      	<optgroup label="Spring">
      		<option>March</option>
      		<option>April</option>
      		<option>May</option>
      	</optgroup>
      	<optgroup label="Summer">
      		<option>June</option>
      		<option>July</option>
      		<option>August</option>
      	</optgroup>
      	<optgroup label="Fall">
      		<option>September</option>
      		<option>October</option>
      		<option>November</option>
      	</optgroup>
      	<optgroup label="Winter">
      		<option>December</option>
      		<option>January</option>
      		<option>February</option>
      	</optgroup>
      </select>
      

      Ich habe gerade mal ein bisschen gespielt mit Deiner Lösung und musste feststellen, dass mit Option-Group kein Select multiple über die Gruppe hinaus mehr funktioniert. ALso z.B. die Auswahl (März, Juni, September, Dezember) ist nicht möglich. Hat das einen wirklichen Sinn?

      Spirituelle Grüße
      Euer Robert
      robert.r@online.de

      --
      Möge der wahre Forumsgeist ewig leben!
      1. @@robertroth

        Ich habe gerade mal ein bisschen gespielt mit Deiner Lösung und musste feststellen, dass mit Option-Group kein Select multiple über die Gruppe hinaus mehr funktioniert. ALso z.B. die Auswahl (März, Juni, September, Dezember) ist nicht möglich. Hat das einen wirklichen Sinn?

        Nein, <select multiple> hat keinen Sinn.

        Wie willst du dem Nutzer verklickern, dass Mehrfachauswahl bei diesem select-Dingens möglich ist? Und wie willst du ihm dann auch noch erklären, wie er das zu berwerkstelligen hätte?

        select ist für Mehrfachauswahl ungeeignet. Checkboxen sind das Mittel der Wahl.

        Und auch bei einfacher Auswahl sind Radiobuttons oft die bessere Wahl, weil der Nutzer die Optionen permanent sieht.

        LLAP

        --
        „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
        1. Liebe Mitdenker, liebe Wissende, liebe Neugierige,

          Ich habe gerade mal ein bisschen gespielt mit Deiner Lösung und musste feststellen, dass mit Option-Group kein Select multiple über die Gruppe hinaus mehr funktioniert. ALso z.B. die Auswahl (März, Juni, September, Dezember) ist nicht möglich. Hat das einen wirklichen Sinn?

          Nein, <select multiple> hat keinen Sinn.

          Falsche Antwort. Innerhalb einer Option-Group funktioniert es doch.
          Oder liegt das gar wieder an der Eigenwilligkeit des Brosers?

          Deine übrigen Ausführungen wegen der Checkboxen kann ich nur bedingt teilen. Das die Browsertools (Eingabe- und Dialogelemente) nicht alle glücklich designed sind, wissen wir doch Alle.

          Wenn ich nur wenig Platz in meinem Form verschenken will, ist <select multiple> gegenüber Checkboxen durchaus im Vorteil.

          Spirituelle Grüße
          Euer Robert
          robert.r@online.de

          --
          Möge der wahre Forumsgeist ewig leben!
          1. Hallo robertroth,

            Ich habe gerade mal ein bisschen gespielt mit Deiner Lösung und musste feststellen, dass mit Option-Group kein Select multiple über die Gruppe hinaus mehr funktioniert. ALso z.B. die Auswahl (März, Juni, September, Dezember) ist nicht möglich. Hat das einen wirklichen Sinn?

            Nein, <select multiple> hat keinen Sinn.

            Falsche Antwort. Innerhalb einer Option-Group funktioniert es doch.
            Oder liegt das gar wieder an der Eigenwilligkeit des Brosers?

            Funktionieren tut es sicher, aber ich kenne keinen Anwender, der versteht, wie er das anwenden muss. Und darum ging es Gunnar. <select multiple> ist ein gescheitertes Konzept.

            Wenn du nicht genug Platz hast, musst du dir was anderes überlegen, aber <select multiple> wird allgemein hin nicht verstanden.

            LG,
            CK

          2. @@robertroth

            Nein, <select multiple> hat keinen Sinn. Falsche Antwort.

            Sicher?

            Innerhalb einer Option-Group funktioniert es doch.

            Nein, das tut es nicht.

            Es mag in dem Sinne funtionieren, dass eine getätigte Mehrfachauswahl zur Formularverarbeitung geschickt wird.

            Es funktioniert nicht in dem Sinne, dass ein Nutzer überhaupt eine Mehrfachauswahl tätigt.

            Wenn ich nur wenig Platz in meinem Form verschenken will, ist <select multiple> gegenüber Checkboxen durchaus im Vorteil.

            Eine Webseite ist in ihrer Höhe unbeschränkt. Warum sollte man da Platz sparen und ein ungeeignetes UI-Element einsetzen wollen?

            LLAP

            --
            „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
          3. Hallo

            Das die Browsertools (Eingabe- und Dialogelemente) nicht alle glücklich designed sind, wissen wir doch Alle.

            Dem möchte ich vehement widersprechen. Wenn nicht mit CSS und JS irgendwelche Formularelemente in ihrer Funktion nicht mehr erkennbar umgestylt oxder umgebaut würden, wäre das kein Problem, denn die Formularelemente werden vom Betriebssystem geborgt. Wer sein OS kennt, (er)kennt auch die HTML-Formularelemente (wieder). Dass diese Auswahl – je nach verwendeter HTML-Version und/oder verwendetem Browser – nicht alle Möglichkeiten abdeckt, möchte ich nicht bestreiten.

            Tschö, Auge

            --
            Verschiedene Glocken läuteten in der Stadt, und jede von ihnen vertrat eine ganz persönliche Meinung darüber, wann es Mitternacht war. Terry Pratchett, “Wachen! Wachen!