tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
2
ZUGRIFFE
4033
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. #1
    Avatar von danielmueller
    danielmueller danielmueller ist offline Mitglied Gold
    Registriert seit
    Jan 2004
    Ort
    Odernheim
    Beiträge
    148
    Ich habe auf meiner Seite zwei select Felder. Nun möchte das wenn man bei der ersten etwas auswählt die sichtbaren Einträge der jeweils anderen einschränken so wie das zb bei momentan bei ebay der Fall ist wenn man einen Artikel einstellt. Ich kann aber auch noch ein Beispiel geben:
    Das erst select Feld enthält die Optionen:
    1.) Autos
    2.) Musik
    Das zweite:
    1.) Gitarren
    2.) Klaviere
    3.)Porsche

    wenn man nun im ersten Feld Musik auswählt soll im zweiten nur noch Gitarren und Klaviere sichtbar sein, und wenn man auf Autos geht nur noch Porsche. Wie kann ich sowas mit Java Skript machen?
     

  2. #2
    Sanic Sanic ist offline Mitglied Gold
    Registriert seit
    Jan 2004
    Beiträge
    109
    Das würde mich auch brennend interessieren!
    Gibt es dafür überhaupt eine JS - Lösung ?
    Ich hoffe doch
     

  3. #3
    Quaese Quaese ist offline Moderator
    tutorials.de Moderator
    Registriert seit
    Feb 2004
    Beiträge
    3.451
    Hi,

    ein Konstrukt mit einem mehrdimensionalen, assoziativen Array sollte das Problem lösen.
    Als Index-Schlüssel des assoziativen Arrays dienen die Values aus den Optionen des
    Select-Bereichs. Als Werte werden dem Index die Elemente zugeordnet, die bei Auswahl
    im zweiten Select-Bereich angezeigt werden sollen.

    Beipiel:
    Code :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
      "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Dynamische Select-Bereiche</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="author" content="Quaese">
    <script language="javascript" type="text/javascript">
    <!--
    var arrOptions = new Array();
     
    // Alle Elemente in Array aufnehmen   - mit Value aus Index 0 als Schlüssel
    arrOptions["optChoose"] = new Array("Geige", "VW", "Klavier", "Horn", "BMW");
    // Musik-Elemente in Array aufnehmen  - mit Value aus Index 1 als Schlüssel
    arrOptions["optMusik"] = new Array("Geige", "Klavier", "Horn");
    // Auto-Elemente in Array aufnehmen   - mit Value aus Index 2 als Schlüssel
    arrOptions["optAuto"] = new Array("VW", "BMW");
     
    function setItems(objForm){
        // Items löschen
        objForm.selItems.length = 0;
     
        // Gewünschte Items durchlaufen
        for(var i=0; i<arrOptions[objForm.selKategorie.value].length; i++){
            // Neue Option erstellen
            objForm.selItems.options[i] = new Option(arrOptions[objForm.selKategorie.value][i], false, true);
            // Value der neuen Option setzen
            objForm.selItems.options[i].value = "opt" + arrOptions[objForm.selKategorie.value][i];
        }
    }
      -->
    </script>
    </head>
    <body>
        <form action="" method="" target="">
            <select name="selKategorie" size="1" onchange="setItems(this.form);">
                <option value="optChoose">- wählen -  <!-- Index 0 -->
                <option value="optMusik">Musik        <!-- Index 1 -->
                <option value="optAuto">Auto          <!-- Index 2 -->
            </select>
            <select name="selItems" size="1">
                <option value="optGeige">Geige
                <option value="optVW">VW
                <option value="optKlavier">Klavier
                <option value="optHorn">Horn
                <option value="optBMW">BMW
            </select>
        </form>
    </body>
    </html>
    Ich hoffe, das hilft Dir/Euch weiter.

    Ciao
    Quaese
     
    Vielleicht muss man manchmal vom Weg abkommen, um nicht auf der Strecke zu bleiben!
    ----
    Der "Fortsetzungsroman" auf www.leuteforum.de

    New kind to realize large scalable projects with jQuery: jQuery SDK

Ähnliche Themen

  1. Dynamisches Select Feld
    Von soa im Forum PHP
    Antworten: 3
    Letzter Beitrag: 31.05.06, 14:40
  2. Antworten: 1
    Letzter Beitrag: 24.09.05, 16:27
  3. Select Feld aus datenbank
    Von roland_t im Forum PHP
    Antworten: 2
    Letzter Beitrag: 16.07.05, 13:57
  4. Select-Feld
    Von renner2000 im Forum PHP
    Antworten: 22
    Letzter Beitrag: 27.05.05, 17:15
  5. select feld on change
    Von limk im Forum Javascript & Ajax
    Antworten: 6
    Letzter Beitrag: 10.12.02, 10:34