Script: Alle Checkboxen markieren hat Fehler?

Professional

Monday, September 21st 2009, 3:49pm

Script: Alle Checkboxen markieren hat Fehler?

Ich habe hier ein Script mit dem man mit dem Anklicken der Checkbox "Gruppe" alle anderen Checkboxen der jeweiligen Gruppe aktiveren kann.
Ich habe das Script erweitert, sodass man 3 Gruppen hat. Einzeln funktioniert das "Alles markieren" wunderbar, wenn jedoch die erste Gruppe markiert ist, lässt sich die zweite erst durch mehrmaliges anklicken markieren. Genauso Gruppe3. Woran kann das liegen?

HTML Code

<html>
<head>
<script type="text/javascript">
<!-- Begin
var checkflag = "false";
 
function check(field) {
if (checkflag == "false") {
  for (i = 0; i < field.length; i++) {
  field[i].checked = true;}
  checkflag = "true";
  return " keine "; }
else {
  for (i = 0; i < field.length; i++) {
  field[i].checked = false; }
  checkflag = "false";
  return " alle "; }
}
 
//  End -->
</script>
</head>
<body>
<form>
Grupp1:<input type="checkbox" value=" alle " onClick="this.value=check(this.form.ide1)"><br>
1<input type="checkbox" id="ide1" name="at1" value="AT1"><br>
2<input type="checkbox" id="ide1" name="at2" value="AT2"><br>
3<input type="checkbox" id="ide1" name="at3" value="AT3"><br>
<br>
Grupp2:<input type="checkbox" value=" alle " onClick="this.value=check(this.form.ide2)"><br>
1<input type="checkbox" id="ide2" name="at4" value="AT4"><br>
2<input type="checkbox" id="ide2" name="at5" value="AT5"><br>
3<input type="checkbox" id="ide2" name="at6" value="AT6"><br>
<br>
Grupp3:<input type="checkbox" value=" alle " onClick="this.value=check(this.form.ide3)"><br>
1<input type="checkbox" id="ide3" name="at7" value="AT7 on"><br>
2<input type="checkbox" id="ide3" name="at8" value="AT8 on"><br>
3<input type="checkbox" id="ide3" name="at9" value="AT9 on"><br>
</form>
</body>
</html>

Torben Brodt

Administrator

Posts: 8,454

Monday, September 21st 2009, 6:14pm

Naja, das liegt am checkflag, das ja von allen drei Varianten genutzt wird. Mach dir am besten ein Array/Object draus.

var checkflag = {ide1: false, ide2: false, ide3: false};
function check(field) {
if (checkflag[field] === false) {
...

Bin mir außerdem nicht sicher, ob das so in allen Browsern funktioniert. (eigentlich darf es nicht funktionieren)
Mit this.form referenziert man eigentlich Elemente per Namen - nicht per ID.
Das erkennst du auch daran, dass ID ein "eindeutiger Identifier" ist - du aber mehrere Elemente mit der selben ID hast.
w3c konform ist das allemal nicht.

Was du also noch so ändern müsstest...

HTML Code

1
2

1<input type="checkbox" name="ide1[]" value="AT1"><br/>
2<input type="checkbox" name="ide1[]" value="AT1"><br/>

Latest blogs: Neuer EX4 Server, Java EE Summit im Juni in München, Kostenlos zur Cebit + Windows 8 Entwickler Schulung

x16

Professional

Posts: 172

Monday, September 21st 2009, 8:28pm

Ok, aber leider brauche ich den Namen für das Formular selber und war somit gezwungen ID zu benutzen. W3C würde mich sicher anzeigen für mein Formular, aber das ist egal, da nur ich es benutzen werde. Und die Ausgabedatei, die das Formular ausspuckt ist valide, von daher also nicht schlimm. Als Browser sollte es auch nur im Firefox und IE funktionieren. Das reicht.
Vielen Dank.