JavaScript | Checkboxen machen weitere Felder sichtbar

[goto;]

Hallo liebe Community,

momentan stehe ich vor einem für mich merkwürdigen Problem.

Ich habe ein Formular, wo der Kunde nach und nach Felder ausfüllen bzw. betätigen muss damit weitere Felder sichtbar werden ( Dient zur Übersichtlichkeit ).

Nun habe ich ein Feld, wo mehrere Checkboxen sind die wie folgt aussehen:

<input type="checkbox" name="typ[]" id="typ" value="A" onclick="checkInput()"/>A 
<input type="checkbox" name="typ[]" id="typ" value="B" onclick="checkInput()"/>B

Der Onclick löst folgendes JavaScript aus:

if(document.project['typ[]'][0].checked==true) {
		programmierung.style.display = "block";
		budgetplan.style.display = "block";
	} else{
		budgetplan.style.display = "none";
		cmssystem.style.display = "none";
		description.style.display = "none";
		whattodo.style.display = "none";
		time.style.display = "none";
		region.style.display = "none";
		anhang.style.display = "none";
	}

Wie ihr seht, werden die Felder mit der id "programmierung" und "budgetplan" sichtbar gemacht.

Bzw. sollten sichbar gemacht werden.

Problem:
Da es je nach vorheriger Auswahl bis zu 50 Checkboxen geben kann, wäre es blödsinn die im "if" abgefragten checkboxen nun 50x mal zu wiederholen .. also immer wieder [0]..[1]..[2]..

Zurzeit wird also NUR das nächste Feld angezeigt, wenn die checkbox "[0]" gechecked wird.

Gibt es eine einfachere Variante dieses umzusetzen? Stehe tierisch auf dem Schlauch.

Danke für eure Hilfe!

Grüße
Andre

 

[Quaese]

Hi,

wie soll es den genau aussehen?

Wenn mindestens eine der bis zu 50 Checkboxen gewählt ist, sollen die Anweisungen im if-Zweig ausgeführt werden, sonst die des else-Zweiges?

In diesem Fall könntest du die Checkboxen in einer for-Schleife durchlaufen und eine boolesche Variable so setzen, dass sie anzeigt, ob mindestens eine Box gechecked wurde oder nicht.

Beispiel:

var blnChecked = false;
for(var i=0, iLen=document.project['typ[]'].length; i<iLen; i++){
  if(document.project['typ[]'][i].checked){
    blnChecked = true;
    break;
  }
}

if(blnChecked) {
  programmierung.style.display = "block";
  budgetplan.style.display = "block";
} else{
  budgetplan.style.display = "none";
  cmssystem.style.display = "none";
  description.style.display = "none";
  whattodo.style.display = "none";
  time.style.display = "none";
  region.style.display = "none";
  anhang.style.display = "none";
}

Desweiteren solltest du beachten, dass eine ID innerhalb eines Dokuments eindeutig sein muss.

Ciao
Quaese

 

[goto;]

Hallo, ist mir jetzt eben auch wieder in den Sinn gekommen Der JavaScript hat ja in dem Sinne nichts mit der ID am Hut. Hab ich bei mir schon raus.
Viele dank für deine Hilfe.. so macht das ganze jetzt auch Sinn

Danke!