WaBis

walter.bislins.ch

Formulare und JavaScript

Elemente Adressieren über ihre ID

Formular-Elemente haben Namen. Unter dem jeweiligen Namen kann der Eingabe-Wert des Elementes zum Beispiel per Wscript abgefragt werden (siehe Funktionen ReqForm, ReqFormT). Jedes Eingabe-Element sollte seinen eigenen Namen erhalten. Eine Ausnahme bilden Checkbox- und Radio-Gruppen. Jedes Element einer Gruppe hat denselben Namen. Die Werte jedes Elementes werden durch Komma getrennt für die ganze Gruppe angegeben.

Um Eingabe-Elemente auch per JavaScript verarbeiten zu können, müssen die Element zusätzlich zum Namen eine eindeutige ID erhalten. Das Wiki erzeugt diese ID für Eingabe-Elemente automatisch. Für einfache Elemente wie Text-Felder und Auswahllisten sind Name und ID identisch. Bei Checkbox- und Radio-Gruppen erhält jedes Element eine ID, die aus dem Namen plus seiner Position innerhalb der Gruppe zusammen gesetzt ist.

Hat zum Beispiel eine Checkbox-Gruppe den Namen Stadt, so erhält die erste Checkbox der Gruppe die ID Stadt0, die nächste Stadt1 usw. Damit kann per JavaScript das entsprechende Element manipuliert werden:

{{form checkbox|Stadt|3| Zürich\|Bern\|Luzern |}}

<jscript>
xGet('Stadt0').checked = true;
xGet('Stadt1').checked = false;
xGet('Stadt2').checked = false;
</jscript>

Ereignisse (Events) behandeln

Form-Elementen können JavaScript-Funktionen für verschiedene Erreignisse zugewiesen werden. Dies geschieht über den Makro-Parameter Flags. Die entsprechenden Funktionen werden beim auftreten der Erreignisse gerufen.

Um zum Beispiel eine Funktion auszuführen, sobald eine Checkbox angeklickt worden ist und sich der Zustand des Elementes geändert hat, kann der Handler onclick definiert werden:

{{form checkbox|Stadt|3| Zürich\|Bern\|Luzern |onclick=StadtChanged(this)|Bern}}

<jscript>
function StadtChanged(ele) {
  alert( 'Element ' + ele.value + ' checked = ' + ele.checked );
}
</jscript>

Über den Parameter this wird das aktuelle Element, also jenes, das gerade angeklickt wird, an die Funktion übergeben. So kann die Funktion einfach feststellen, welches Element einer Gruppe angeklickt wurde.

So sieht das aus:

Zürich  Bern  Luzern 
Weitere Infos zur Seite
Erzeugt Dienstag, 27. Oktober 2009
von wabis
Zum Seitenanfang
Geändert Mittwoch, 20. Januar 2016
von wabis