Checkbox, Array, Funktionsaufruf

[Marcel]

Hallo,

ich habe ein PHP Formular. Innerhalb dieses Formulars kann ein Benutzer eine Auswahl in Form von mehreren Checkboxen treffen. Da es ein PHP Skript ist, nutze ich die Möglichkeit, den Code dynamisch zu erzeugen:

  
<form name="Liste" ... >  
...  
for( $i = 0; $i < sizeof( $irgendwas ); $i++ )  
  print '<input type="checkbox" name="Auswahl[]" value="" />';  
...  
</form>  

Meistens ist es aber der Fall, dass der Benutzer alle Checkboxen anklicken will. Zur Vereinfachung habe ich daher eine weitere Checkbox "alle Auswählen" unterhalb der anderen angelegt. Bisher war der JS-Code in dem PHP Skript eingebettet. Da es aber allmählich unübersichtlich wurde, habe ich den Code nun in eine externe .js-Datei gesteckt. Hier taucht nun mein Problem auf.

Vormals erfolgte der Aufruf durch ein einfaches onChange="WaehleAlle()". Innerhalb der Funktion stand dann unter anderem:

  
dieAuswahl = document.forms["Liste"].elements["Auswahl[]"];  

Nun soll der Aufruf erfolgen durch: onChange="WaehleAlle(FormName, Auswahlliste)". "Auswahlliste" ist aber ein Array und ich weiß einfach nicht, wie ich dieses Array "packen" und an die JS-Funktion übergeben kann. Und wie im einzelnen der Funktionskopf auszusehen hat, weiß ich auch nicht 100 %. :-(

Eine Ausgabe in der Funktion sagt mir jedesmal entweder was von [HTML object] oder liefert "undefined". Ich weiß nicht, was ich falsche mache und hoffe, jemand kann mir helfen.

Gruß,
Marcel

[Micha]

Hallo Marcel,

Nun soll der Aufruf erfolgen durch: onChange="WaehleAlle(FormName, Auswahlliste)". "Auswahlliste" ist aber ein Array und ich weiß einfach nicht, wie ich dieses Array "packen" und an die JS-Funktion übergeben kann.

Du übergibts ein Array genauso, wie eine normale (primitive) Variabel.

  
function func(a){  
  window.alert(a.join(", ");  
}  
var arr ["foo", "bar", "baz"];  
  
func(arr);

Eine Ausgabe in der Funktion sagt mir jedesmal entweder was von [HTML object]

Und was lässt Du Dir ausgeben?

Mit freundlichem Gruß
Micha

[Marcel]

Hallo Micha,

Und was lässt Du Dir ausgeben?

Mein Funktionskopf und die Ausgabe sehen so aus:

function WaehleAlle( formName, AuswahlListe, AuswahlAlle )  
{  
alert(formName +" - "+ AuswahlListe +" - "+ AuswahlAlle);  
// ... Hier noch Weiteres ...  
}

Dabei ist formName, der Name des Forms, in welchem sich alles abspielt, AuswahlListe ist das Array, welches irgendwie nicht so will, wie ich und AuswahlAlle ist entweder true oder false, also Alle oder Keines auswählen.

Das Array AuswahlListe soll dann innerhalb des danach folgenden Codes weiter bearbeitet werden. Aber da bekomme ich durch die JavaScript-Konsole die Mitteilung: "AuswahlListe has no properties".

Gruß,
Marcel

[Micha]

Hallo Marcel,

okay, und was ist bzw. enthält AuswahlListe? Sollte nicht durch den Namen des Formulars bereits eine Möglichkeit bestehen, diese Liste anzusprechen?

Mit freundlichem Gruß
Micha

[Marcel]

Hallo Micha,

okay, und was ist bzw. enthält AuswahlListe? Sollte nicht durch den Namen des Formulars bereits eine Möglichkeit bestehen, diese Liste anzusprechen?

Da verstehe ich nicht ganz, was du meinst. Daher hier nochmal ein Auszug:

Im PHP Skript:

  
<form name="Liste" ... >  
...  
for( $i = 0; $i < sizeof( $irgendwas ); $i++ )  
  print '<input type="checkbox" name="Auswahl[]" value="'.$irgendwas[$i].'" />';  
  
print '<input type="checkbox" name="AuswahlAlle" value="" onChange="javascript:WaehleAlle( this.form.name, XXXXX , this.name )" />';  
...  
</form>  

Die Stelle mit XXXXX ist hier der wunde Punkt.

Der JS-Teil:

  
function WaehleAlle( formName, AuswahlListe, AuswahlAlle )  
{  
alert(formName +" - "+ AuswahlListe +" - "+ AuswahlAlle);  
var checkboxes = new Array();  
    checkboxes = document.forms[formName].elements[XXXXX];  
// ... Hier noch Weiteres ...  
}

Auch hier an der Stelle XXXXX der wunde Punkt. Der Rest des JS-Teils besteht dann nur noch darin, checkboxes.length zu ermitteln und mit einer for-Schleife alle enthaltenen Checkboxen abzuklappern und entsprechend den Wert annehmen zu lassen, den AuswahlAlle hat, also true oder false.

Gruß,
Marcel

[Marcel]

Hallo,

ich habe es geschafft und bin dem Denk- bzw. Anwendungsfehler auf die Schliche gekommen. Meine alert()-Ausgabe zeigt mir nun ein [object NodeList], wie es sein sollte.

Der Fehler (gern gemacht und immer wieder drauf reingefallen) lag daran, dass der Aufruf zwar lautet:

  
document.forms["foo"].elements["bar"]  

~~~dieses aber innerhalb eines onChange="" leider dazu führt, dass die enthaltenen Anführungszeichen, das Ende des Events vorzeitig festlegen und sich für den Compiler also das Bild ergab.  
~~~javascript
  
onChange="javascript:WaehleAlle(document.forms["  

Der nächste Denkfehler war, dass ich bereits "document.forms[]..." übergebe und innerhalb der Funktion noch einmal versuche darauf ein "document.forms[]..." anzuwenden. (Da so aus der ursprünglichen Version kopiert, aber nicht abgeändert.) Das geht natürlich nach hinten los.

Naja, wer suchet, der findet. Ich danke dir für die Hilfe Micha.

Gruß,
Marcel

[Micha]

Hallo Marcel,

onChange="javascript:WaehleAlle(document.forms["

  
In einem Event-Handler ist das Protokoll "javascript" nicht mehr nötig - um nicht zu sagen, falsch. Es reciht also, wenn Du direkt die Funktion aufrufst:  
  
~~~javascript
  
onchange="WaehleAlle(...)"  

Mit freundlichem Gruß
Micha

[Marcel]

Hallo Micha,

In einem Event-Handler ist das Protokoll "javascript" nicht mehr nötig - um nicht zu sagen, falsch. Es reciht also, wenn Du direkt die Funktion aufrufst:

onchange="WaehleAlle(...)"

  
Danke für den Hinweis. Werd's mir merken. :-)  
  
Schönes Wochenende. Gruß,  
Marcel