Dynamisches Auswahl-Formular/Fehler im IE

I

Icevarta

Grünschnabel
Hallo
Ich schreibe grade eine Suchfunktion. Unter anderem kann man auch in Unterschiedlichen Kategorien suchen. Es gibt Haupt- und Unterkategorien. Dabei soll in einem <select> Formular eine Hauptkategorie ausgesucht werden worauf dynamisch ein neues <select> Formular Angezeigt werden soll.
Dazu wird bei einer Auswahl im Hauptkategorien-Formular der Wert Ausgelesen, alle Unterkategorien als Unsichtbar gesetzt und die Ausgewählte Unterkategorie wieder auf sichtbar gesetzt.

Code: 
<html>
<head>
<script type="text/javascript">
    function Auswahl () {
        var eins = document.getElementById("HK").value;

        document.getElementById("1").style.display='none';
        document.getElementById("2").style.display='none';
        document.getElementById("3").style.display='none';

        if(eins != null){
            document.getElementById(eins).style.display='inline';
        }
    }

    function Senden () {
       var hk = document.getElementById("HK").value;
       var sk = document.getElementById(hk).value;

       document.getElementById("HKH").setAttribute("value", hk);
       document.getElementById("SKH").setAttribute("value", sk);
    }
</script>
</head>

<body>
  <form action="ergebnis.php" method="get">
    <input type="text" name="Tag"> <input type="hidden" name="Sortierung" value="1"> <input type="radio" name="Suchart" value="1" checked>Auch nach Wortteilen suchen<br>
    <input type="radio" name="Suchart" value="2">Nur nach ganzem Wort suchen<br>
    <input type="hidden" name="HK" id="HKH">
    <input type="hidden" name="SK" id="SKH">
    <input type="submit" value="Suche" onclick="Senden()">
  </form>
  <form>
    <select name="1" id="HK" size="0" onchange="Auswahl()">
      <option value="">
      </option>

      <option value="1">
        Architektur
      </option>

      <option value="2">
        Tiere
      </option>

      <option value="3">
        Menschen
      </option>

    </select> <select name="s1" id="1" size="0" style="display:none">
      <option value="1">
        Gebäude
      </option>

      <option value="2">
        Hochäuser
      </option>

      <option value="3">
        Industrieanlagen
      </option>

    </select> <select name="s2" id="2" size="0" style="display:none">
      <option value="13">
        Insekten
      </option>

      <option value="14">
        Vögel
      </option>

      <option value="15">
        Säugetiere
      </option>
    </select> <select name="s3" id="3" size="0" style="display:none">
      <option value="21">
        Schüler
      </option>

      <option value="22">
        Lehrer
      </option>

      <option value="23">
        Kinder
      </option>
    </select>
  </form>
</body>
</html>
Den Code hab ich zur übersicht mal gekürzt.
Im Firefox funktioniert das Skript wie gewünscht, im IE werden die Unterkategorien aber im Formular der Hauptkategorien angezeigt. Gibt es eine Möglichkeit das zu ändern?

Vielen dank schon mal
Icevarta
 
Moin,

bei mir wird dein Skript im IE überhaupt nicht ausgeführt, da es einen Fehler erzeugt.

Code: 
var eins = document.getElementById("HK").value;
Die ID HK ist für den IE nicht eindeutig genug...er findet da jenes:
Code: 
<input type="hidden" name="HK" id="HKH">
...anhand des gleichlautenden name-Attributes.
Lösung: benenne die Sachen so um, dass der IE nicht in diesen Konflikt gerät.
Dabei kannst du gleich die IDs 1 2 und 3 ändern, denn das erste Zeichen eines IDREF-Attributes darf keine Ziffer sein.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück