Liste von gleichnamigen Checkboxen in einem Formular durchiterieren

[stbi]

Mahlzeit,

in einem Formular befindet sich eine unbestimmte Anzahl (1...100) gleichnamiger Checkboxen, die ich in einer Schleife durchiterieren will, um z.B. die Eigenschaft "checked" abzufragen und so etwa die Anzahl der gesetzten Häkchen zu zählen. Hierzu mache ich z.B. Folgendes:

HTML:

<form name="Formular">
    <input type="checkbox" name="Checkbox" value="1">
    <input type="checkbox" name="Checkbox" value="2">
    ...
</form>

JavaScript:

var nCheckedCount = 0;

for(var nIndex = 0; nIndex < document.Formular.Checkbox.length; nIndex++)
{
    if(document.Formular.Checkbox[nIndex].checked)
    {
        nCheckedCount++;
    }
}

Bei 2...100 Checkboxen funktioniert das auch wunderbar, aber wenn in dem Formular nur eine Checkbox existiert, dann wird offensichtlich kein Array aufgebaut, das man per .length bzw. [nIndex] ansprechen kann. Es geht dann nur document.Formular.Checkbox.checked, was mir aber in der Schleife nichts nützt.

Hier noch eine Beispielseite, die das Problem demonstriert: Test

Ich habe mir jetzt erst mal mit einem Hack beholfen, indem ich zusätzlich am Ende des Formulars ein Hidden-Feld mit dem Namen der Checkboxen angefügt habe:

<form name="Formular">
    <input type="checkbox" name="Checkbox" value="1">
    <input type="checkbox" name="Checkbox" value="2">
    ...
    <input type="hidden" name="Checkbox" value="">
</form>

Beim Iterieren muß man dieses natürlich ignorieren, d.h. die Schleife darf nur bis length - 1 gehen:

var nCheckedCount = 0;

for(var nIndex = 0; nIndex < document.Formular.Checkbox.length - 1; nIndex++)
{
    if(document.Formular.Checkbox[nIndex].checked)
    {
        nCheckedCount++;
    }
}

Mein Gefühl sagt mir aber, daß es auch noch eine bessere Lösung geben muß, aber irgendwie hab' ich wohl grad' 'n Brett vorm Kopp... Gibt es einen besseren Weg, um eine unbestimmte Anzahl gleichnamiger Elememte in einem Formular der Reihe nach anzusprechen?

Gruß,
Stefan

 

[threadi]

Was Du suchst ist imho getElementsByTagName(), dabei kommt immer ein Array raus. Bezogen auf deinen Beispielcode:

var nCheckedCount = 0;

var inputs = document.getElementsByTagName("input");

for(var nIndex = 0; nIndex < inputs.length - 1; nIndex++)
{
    if( inputs[nIndex].type == "checkbox" && inputs[nIndex].checked )
    {
        nCheckedCount++;
    }
}

Ungetestet. Müsstest Du ggfs. noch auf das Formular-Objekt begrenzen.

 

[stbi]

OK, danke, das war schonmal ein Wink in die richtige Richtung.

Habe mir jetzt eine Funktion gebastelt, die mir ein Array von Input-Elementen eines bestimmten Namens zurückgibt:

function GetInputElementsByName(strInputName)
{
	var arrResult = new Array();

	var arrInputElements = document.Formular.getElementsByTagName("input");

	for(var nIndex = 0; nIndex < arrInputElements.length; nIndex++)
	{
		if(arrInputElements[nIndex].name == strInputName)
		{
			arrResult.push(arrInputElements[nIndex]);
		}
	}

	return arrResult;
}

Anwendung:

var nCheckedVotedCount = 0;

var arrCheckboxes = GetInputElementsByName("Checkbox");

for(var nIndex = 0; nIndex < arrCheckboxes.length; nIndex++)
{
	if(arrCheckboxes[nIndex].checked)
	{
		nCheckedVotedCount++;
	}
}

Der Formname ist hier zwar hardcodiert, aber da es eh nur ein Formular gibt, war mir das jetzt mal egal...
Jedenfalls muß ich so jetzt nicht die ganzen Schleifen umbauen und dort noch zusätzliche ifs einbauen.