Manual:HTMLForm Tutorial 2/de

Der Rest dieser Seite befasst sich mit der Verwendung von HTML Formular durch generische -Einträge (Einstellungen, die für alle Feldtypen gelten). Wir arbeiten daher nur an  'HTMLTextField'  Eingaben.

Überspringe den allgemeinen Teil und gehe direkt zu den Feldspezifikation

Hier sind wir in Und arbeiten an der   -Funktion ...

Hinzufügen eines einfachen Textfeldes
Ersetzen wir "Hallo Welt" durch ein Textfeld namens Nun sieht das Formular wie folgt aus:



Callback hinzufügen
Leider zeigt der vorherige Code das Formular an, aber das Formular funktioniert nicht. Wir müssen eine Abfolge schreiben, um die Formulareingabe zu verarbeiten! Das Formular verarbeitet nun die übermittelten Daten:



Übermittlungsmethode
Das Formular kann so eingestellt werden, dass entweder die POST- oder die GET-Übermittlungsmethode verwendet wird.


 * POST (Standardeinstellung): Der Inhalt der Formularfelder wird in der Seiten-URL nicht angezeigt. Diese Methode sollte für Formulare verwendet werden, die den Wiki-Inhalt ändern (z. B. Seiten bearbeiten oder Benutzer blockieren).


 * GET: Der Inhalt der Formularfelder wird in der Seiten-URL angezeigt. Die resultierende URL kann mit einem Lesezeichen versehen oder verknüpft werden, damit andere sie anzeigen können. Die Übermittlung sehr langer Formulare (mehrere Kilobyte Text) kann jedoch fehlschlagen. Diese Methode sollte für Formulare verwendet werden, die den Wiki-Inhalt nicht ändern (z. B. eine Liste von Seiten anzeigen).

Wenn Du vor hast, die Daten über eine GET-Anforderung zu übermitteln, musst Du Folgendes hinzufügen:

Beachte, dass für GET-Formulare, die ein - oder   -Feld verwenden, eine "Formular-ID" festgelegt sein muss, damit sie ordnungsgemäß funktioniert, genauso wie wenn Du mehrere Formulare auf einer Seite verwendest –  siehe unten: Verwendung mehrerer Formulare auf einer Seite.

Validierung hinzufügen
Felder können vor dem Absenden eines callbacks einzeln validiert werden.

Zuerst geben wir die Anweisung HTMLForm, indem wir diese Zeile hinzufügen: in : Dann schreiben wir die Validierungslogik: Die Validierungslogik überprüft nun die übermittelten Daten vor der Verarbeitung:



Erforderliches Feld
Du kannst angeben, dass ein Feld erforderlich ist, indem Du es einfach zum formDescriptor hinzufügst. Jeder validation-callback wird überschrieben. Wenn Du ein erforderliches Feld validieren möchtest, füge Deiner Validierungs-callback.Funktion die folgende Logik hinzu:

Filter hinzufügen
Filtering happens BEFORE validation to change input.

formDescriptor declaration: Filtering logic:

Adding i18n support
Mit dieser Funktion kannst Du das Label in die Sprache übersetzen, die in den Benutzereinstellungen definiert ist. Ersetze einfach 'label' durch 'label-message' im formDescriptor, um die Zeichenfolge automatisch über die i18n-Routine abzurufen: Vergiss nicht, den richtigen Eintrag in die Dateien aufzunehmen. Zum Beispiel hier in Englisch und Französisch:

For the submit button, we need to do it "manually": Of course, as always, you'll need to add the myform-submit entry in the localization files.

Adding sections
Now, we need to add some fields and organize them, let's switch to a bigger formDescriptor.

The section string displayed is automatically fetched from the localization files. Here we therefore need to add this in en.json :

Now, the form looks like:



Subsections
Sections can be easily nested with the incredible power of /.

The i18n ID will be like:

Now, the form looks like:



Adding Help-text
What about providing users with instructions to use your form easily? or  (an i18n message name) are here for you.

Now, the form looks like:



Adding html CLASS and ID
and  are here for you.

Changing Name of input
By default, input name is, for the previous example, the input name is therefore. This can be changed with : Just to give you an idea, here is the HTML output generated:

Disabling input
disabled is there and the user cannot copy (CTRL-C) input. The item will not be valid for submission. As simple as that!

Turning input read-only
readonly ist vorhanden und der Benutzer kann keine Eingaben ändern. Again, as simple as that!

Using multiple forms on a single page
If you use multiple forms on a single special page (e.g. one to show search results, and another to modify a result), you need to set a "form identifier" to allow HTMLForm to detect which of the forms was submitted. The identifier can be any string, and it must be different for every form.

For technical reasons, this is also necessary when using a  or   field in a GET form; otherwise HTMLForm can't detect whether the form was submitted and therefore whether it should load the default values or not.

NEXT PAGE OF THE TUTORIAL