Checkboxen gruppieren

chill0r55555

Mitglied
Hallo,

ich habe 4 Checkboxen in einer Form. Beim Klick von je 1ner soll der Wert 1 oder 0 in ein Textfeld geschrieben Werden. Das klappt auch wunderbar. Nur sobald 1 Textfeld sich vor den Checkboxen befinden klappt es nichtmehr. Wie kann ich die Abfrage in meiner Funktion umschreiben damit nur die Checkboxen als Wert genommen werden und nicht noch ein anderes HTML-Element?

Hier mal der Code:

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <script LANGUAGE="JavaScript">


function modifyField(form)
{


  sum = "";

  for (i=0; i < 4; i++) {
    if (form.elements[i].checked == true) {
      sum = sum + "1";
    } else {
      sum = sum + "0";
    } 
    
  }

  document.formular.Summe.value = sum;
  
}
</script>
  </head>
  <body>
<form name='formular'>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type=text name=Summe>
</form>
  </body>
</html>

MfG




Edit:

Hier ein Beispiel wie es nichtmehr funktioniert:
Code:
<form name='formular'>
<input type=text name=as value=1><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type=text name=Summe>
</form>
 
Zuletzt bearbeitet:
Du kannst auch anhand des Namens auf die Boxen zugreifen:
Code:
if(form.elements['Box'][i].checked == true)

Hi,

danke für deine Antwort aber das scheint leider nicht zu funktionieren. Ich habe eine Fehler-Konsole im Firefox und da sagt er mir:

Code:
Fehler: document.formular.Box has no properties


Die Checkboxen hab ich unten auch durchnummeriert aber brachte leider nichts:suspekt:

Code:
<input type=text name=as value=1><br>
<input type="Checkbox" name="Box1" id="checkbox1" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box2" id="checkbox2" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box3" id="checkbox3" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box4" id="checkbox4" value="" onclick="modifyField(document.formular);"><br>
<input type=text name=Summe>


MfG
 
Dann hast du etwas falsch geändert, denn so funktioniert es:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  <script LANGUAGE="JavaScript">


function modifyField(form)
{


  sum = "";

  for (i=0; i < 4; i++) {
    if(form.elements['Box'][i].checked == true) {
      sum = sum + "1";
    } else {
      sum = sum + "0";
    } 
    
  }

  document.formular.Summe.value = sum;
  
}
</script>
  </head>
  <body>
<form name='formular'>
<input type=text name=as value=1><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type="Checkbox" name="Box" id="checkbox" value="" onclick="modifyField(document.formular);"><br>
<input type=text name=Summe>
</form>
  </body>
</html>
 
Hey danke für deine schnelle Antwort.
Es funktioniert jetzt. Aber nur wenn die Boxen alle den gleichen Namen haben. Wenn ich die Boxen nummeriere dann funktioniert es nichtmehr. Komische Sache. Weil eigentlich würde dann ja die Abfrage oben heißen:

Code:
if(form.elements['Box1].checked == true){ ,
if(form.elements['Box2].checked == true){ , ....

Aber die Boxen heißen ja nur "Box":confused:

Gruß
 
In deinem Eingangsposting, worauf sich meine Antwort bezog, heissen doch alle Boxen "Box".

Die Browser speichern gleichnamige Elemente in einem Array(der IE nur, wenn es mindestens 2 gleichnamige Elemente gibt)

Somit heisst der Array
Code:
document.formular.elements['Box']
...und zugreifen tust du darauf wie üblich bei Arrays, über den Index des benötigten Elements:
Code:
document.formular.elements['Box'][intIndex]
 
Zurück