JS steuert falsche Buttons an

Sprint · 12. November 2009

Hallo Kollegen,

in einem Formular sollen mit einer Reihe von Radio Buttons verschiedene Gruppen von Checkboxen gesteuert werden. Das funktioniert aber nur, solange alle Checkboxen da sind. Nun ist es aber so, daß diese Checkboxen nur angezeigt werden sollen, wenn damit verknüpfte Dokumente vorhanden sind. Das wird mit PHP geprüft und wenn eine Datei nicht da ist, wird die Checkbox nicht eingefügt. In diesem Fall flippt JS aber völlig aus wenn es im Ablauf auf eine Box stößt, die nicht da ist. Hier im Demo-Quelltext hab ich das mal mit einer auskommentierten Box simuliert.
Wie kann ich JS dazu überreden, auch bei fehlenden Boxen richtig zu arbeiten?

Und noch was anderes in dem Zusammenhang. Um die spätere Verarbeitung mit PHP zu erleichtern, würde ich gerne die Checkboxen als Array übergeben (maildoc[]). Wie kann ich die dann aber in JS ansprechen?

HTML:

<html>
	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<script type="text/javascript">
			function zuordnung(paket){
				switch (paket){
					case "1":
						document.versand.maildoc1.disabled = false;
						document.versand.maildoc2.disabled = true;
						document.versand.maildoc3.disabled = true;
						document.versand.maildoc4.disabled = true;
						document.versand.betreff.disabled = true;
						document.versand.maildoc1.checked = true;
						document.versand.maildoc2.checked = false;
						document.versand.maildoc3.checked = false;
						document.versand.maildoc4.checked = false;
						break;
					case "2":
						document.versand.maildoc1.disabled = true;
						document.versand.maildoc2.disabled = false;
						document.versand.maildoc3.disabled = true;
						document.versand.maildoc4.disabled = true;
						document.versand.betreff.disabled = true;
						document.versand.maildoc1.checked = false;
						document.versand.maildoc2.checked = true;
						document.versand.maildoc3.checked = false;
						document.versand.maildoc4.checked = false;
						break;
					case "3":
						document.versand.maildoc1.disabled = true;
						document.versand.maildoc2.disabled = true;
						document.versand.maildoc3.disabled = false;
						document.versand.maildoc4.disabled = true;
						document.versand.betreff.disabled = true;
						document.versand.maildoc1.checked = false;
						document.versand.maildoc2.checked = false;
						document.versand.maildoc3.checked = true;
						document.versand.maildoc4.checked = false;
						break;
					case "4":
						document.versand.maildoc1.disabled = true;
						document.versand.maildoc2.disabled = true;
						document.versand.maildoc3.disabled = true;
						document.versand.maildoc4.disabled = false;
						document.versand.betreff.disabled = true;
						document.versand.maildoc1.checked = false;
						document.versand.maildoc2.checked = false;
						document.versand.maildoc3.checked = false;
						document.versand.maildoc4.checked = true;
						break;
					case "5":
						document.versand.maildoc1.disabled = false;
						document.versand.maildoc2.disabled = false;
						document.versand.maildoc3.disabled = false;
						document.versand.maildoc4.disabled = false;
						document.versand.betreff.disabled = false;
						document.versand.maildoc1.checked = false;
						document.versand.maildoc2.checked = false;
						document.versand.maildoc3.checked = false;
						document.versand.maildoc4.checked = false;
						break;
				}
			}
		</script>
	</head>
	<body>
		<form id="versand" action="kfzprt.php" method="post" name="versand">
			<input type="radio" name="paket" value="1" onclick="zuordnung(this.value)"> 
			<input type="radio" name="paket" value="2" onclick="zuordnung(this.value)"> 
			<input type="radio" name="paket" value="3" onclick="zuordnung(this.value)"> 
			<input type="radio" name="paket" value="4" onclick="zuordnung(this.value)"> 
			<input type="radio" name="paket" value="5" onclick="zuordnung(this.value)">
			<input type="checkbox" name="maildoc1" value="pdf/30123-1.pdf" disabled="disabled">
			<input type="checkbox" name="maildoc2" value="pdf/30123-2.pdf" disabled="disabled">
			<!--input type="checkbox" name="maildoc3" value="pdf/30123-3.pdf" disabled="disabled"-->
			<input type="checkbox" name="maildoc4" value="pdf/30123-4.pdf" disabled="disabled">
			<input type="text" name="betreff" size="30" disabled="disabled">
			<input type="submit" name="submitButtonName" value="Email versenden">
		</form>
	</body>
</html>

Quaese · 12. November 2009

Hi,

du kannst mit Hilfe von typeof testen, ob die Checkbox undefiniert ist:

Code:

if(typeof document.versand.maildoc3 != "undefined") document.versand.maildoc3.disabled = true;

Wenn du die Checkboxen wie von dir gewünscht ansprechen möchtest, verwende die elements-Kollektion.

Code:

var arrCB = document.versand.elements['maildoc[]'];

Das liefert dir ein Array mit allen Checkboxen, die diesen Name besitzen.

Ansprechen kannst du sie über ihren Index:

Code:

document.versand.elements['maildoc[]'][0]

Liefert das erste Checkboxelement.

Ciao
Quaese

Sprint · 13. November 2009

Hi Quaese,

danke für deine Hilfe. Typeof hat wunderbar funktioniert. Nur elements funktioniert leider nicht. D.h. es funktioniert schon, aber nur, solange alle Boxen da sind. Wenn aber ein paar Boxen fehlen, verzählt er sich und markiert verkehrte, da ja im JS Teil alle eventuellen Boxen aufgeführt werden. Bei indoviduellen Namen merkt er daß mittendrin was fehlt. Bei elements zählt er einfach durch so daß immer nur die letzten Boxen fehlen. Werde es dann wohl bei individuellen Namen lassen.

JS steuert falsche Buttons an

Sprint

Erfahrenes Mitglied

Quaese

Moderator

Sprint

Erfahrenes Mitglied

Neue Beiträge