Checkboxen mit Array ausgeben (dynamisch)

Florian123

Mitglied
Hallo zusammen!

Ich habe folgendes Problem, wo ihr mir bestimmt weiter helfen könnt. Und zwar möchte ich eine diverse Anzahl von Checkboxen ausgeben, wenn man aus einer Drop Down Liste ein Oberpunkt anklickt.

Die Werte sind alle in Arrays gespeichert. Momentan werden die Unterpunkte in weiteren DropDownListen ausgeben, was ich gerne verändert haben möchte!

Das Problem liegt wahrscheinlich (aus meiner Sicht) in der Funktion + Ausgabe Script!

Vielen Dank für Eure Hilfe im Voraus!

Florian
Code:
<html>
<head>
<title>Navigation</title>
<script type="text/javascript"><!--
// *** globale Variablen
var urls = new Array(
   new Array(""),
   new Array("", "seite1–1.html", "seite1–2.html", "seite1–3.html"),
   new Array("", "seite2–1.html", "seite2–2.html"),
   new Array("", "seite3–1.html", "seite3–2.html", "seite3–3.html", "seite3–4.html")
);
var beschriftung = new Array(
   new Array("Bitte auswählen", ""),
   new Array("Bitte auswählen", "Punkt 1.1", "Punkt 1.2", "Punkt 1.3"),
   new Array("Bitte auswählen", "Punkt 2.1", "Punkt 2.2"),
   new Array("Bitte auswählen", "Punkt 3.1", "Punkt 3.2", "Punkt 3.3", "Punkt 3.4")
);
// *** Ende der globalen Variablen
function kategorie_anzeigen(f) {
   var kategorie = f.kategorien.selectedIndex;
   f.unterpunkte.options.length = urls[kategorie].length;
   for (var i=0; i<urls[kategorie].length; i++) {
      f.unterpunkte.options[i].text =
         (beschriftung[kategorie])[i];
   }
}
function seite_laden(f){
   var kategorie = f.kategorien.selectedIndex;
   var unterpunkt = f.unterpunkte.selectedIndex;
}
//--></script>
</head>
<body>
<h1>Navigation mit Auswahllisten</h1>
<form>
<select name="kategorien"
onchange="kategorie_anzeigen(this.form);">
   <option>Bitte auswählen</option>
   <option>Kategorie 1</option>
   <option>Kategorie 2</option>
   <option>Kategorie 3</option>
</select>
<select name="unterpunkte"
onchange="seite_laden(this.form);">
   <option>Bitte auswählen</option>
</select>
</form>
</body>
</html>
 
Moin Florian,

Code:
function kategorie_anzeigen(f) {

var kategorie = f.kategorien.selectedIndex;
document.getElementById('unterpunkte').innerHTML='';
for (var i=1; i<beschriftung[kategorie].length; i++) {
document.getElementById('unterpunkte').innerHTML+=
  '<input type="checkbox" name="unterpunkte" value="'+beschriftung[kategorie][i]+
  '">'+beschriftung[kategorie][i];

}
}

Die Liste "unterpunkte" müsstest du noch ersetzen durch
Code:
<div id="unterpunkte"></div>
 
Hallo Sven,

vielen vielen Dank für deine Hilfe!

Die Funktion + div Anweisung hat SUPER geklappt.

Eine Frage hätte ich noch und zwar können die Checkboxen untereinander ausgegeben werden?

Wenn "JA", wo muss der <br> im Script stehen?

Vielen Dank noch einmal für die Hilfe!

MFG

Florian
 
Probier doch mal:

Code:
document.getElementById('unterpunkte').innerHTML+=
  '<input type="checkbox" name="unterpunkte" value="'+beschriftung[kategorie][i]+
  '">'+beschriftung[kategorie][i]+'<br>';
 

Neue Beiträge

Zurück