1.1.2. Formulare
Interaktive Oberflächen können mit der PHP GUI auf Basis von Formularen erstellt werden. Das bedeutet, dass innerhalb der Webseite Eingabekomponenten innerhalb einer Formularkomponente platziert werden und beim Absenden des Formulars ihre Werte per GET oder POST an das Skript übermitteln (die Voreinstellung ist POST). Die Formularkomponente selbst ist eine unsichtbare Strukturkomponente, die lediglich dazu dient, die Werte der in ihr enthaltenen Eingabekomponenten zu sammeln und abzusenden. Das Verfahren entspricht dem der <form> Elemente in HTML.
Jeder Einzelkomponente, die die Eingabe oder Auswahl eines oder mehrerer Werte ermöglicht, kann über die Methode setName() ein Name für das Formuarfeld zugewiesen werden. Beim Absenden des Formulars stehen die eingegebenen bzw. ausgewählten Werte dann unter diesem Namen in den entsprechenden globalen Variablen zur Verfügung. Die statische Methode getValue() der Hilfsklasse GhCoreGlobals bietet eine einfache Möglichkeit, die Formularvariablen nach dem Absenden auszulesen.
Das folgende Beispiel zeigt, wie ein Formular mit einem Textfeld und einem Button zum Absenden erstellt und das Ergebnis angezeigt werden kann:
Beispiel für ein einfaches Formular:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?php
// GREYHOUND PHP GUI laden:
require_once 'ghgui/ghgui.php';
// Webseite erstellen:
$page = new GhGuiExtensionPage('PHP GUI Beispiel');
// Formular zur Webseite hinzufügen:
$form = new GhGuiForm();
$page->addComponent($form);
// Textfeld mit dem Namen 'inputValue' zum Formular hinzufügen:
$form->addComponent(new GhGuiTextBox('inputValue'));
// Button zum Absenden des Formulars hinzufügen:
$form->addComponent(new GhGuiButton('Absenden'));
// Falls das Formular abgeschickt wurde wird die Eingabe ausgegeben:
$input = GhCoreGlobals::getValue('inputValue');
if($input !== null)
$form->addComponent(new GhGuiText('Folgender Text wurde eingegeben: ' . $input));
// Webseite anzeigen:
$page->show();
Die Komponenten, die Eingaben oder Auswahlen ermöglichen, initialisieren sich in der Regel mit dem zuvor abgesendeten Wert. D.h. wenn unter dem Feldnamen einer Komponente bereits ein Wert vorliegt wenn die Webseite angezeigt wird, dann wird die Komponente mit diesem Wert befüllt. So bleiben die abgeschickten Werte bei erneuter Anzeige desselben Skripts in den Eingabekomponenten erhalten. Dieser Automatismus lässt sich über die Methode setUseCurrentValue() pro Komponente deaktivieren.
In diesem Beispiel führt das Absenden des Formulars zum Aufruf desselben Skripts, welches auch die Webseite angezeigt hat. Optional kann der Formularkomponente auch ein anderes Skript zur Anzeige des Ergebnisses angegeben werden. Dies entspricht dem Attribut action bei HTML-Formularen.
Ebenso lässt sich, wie bei HTML-Formularen auch, ein anderes Ziel für das Formular angeben. Dies kann der Name eines Fensters sein, in welches die Werte des Formulars abgeschickt werden sollen (z.B. _parent, _top) oder auch ein IFrame innerhalb der Webseite, welches die Formulardaten aufnehmen soll. Das Formularziel kann über die Methode setTarget() gesetzt werden.
Das folgende Beispiel ist einer Erweiterung des vorhergehenden, wobei die Webseite nun in einen oberen und einen unteren Bereich aufgeteilt wird. Im oberen Bereich ist das Formular aus dem vorigen Beispiel enthalten, im unteren Bereich ein IFrame, in welches das Formular nun seine Daten sendet. Das Beispiel besteht aus zwei Dateien, einer für die Webseite mit dem Formular und dem IFrame (hier index.php) und einer für den Inhalt des IFrames (hier iframe.php):
Beispiel eines Formulars mit IFrame - index.php:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<?php
// GREYHOUND PHP GUI laden:
require_once 'ghgui/ghgui.php';
// Webseite erstellen:
$page = new GhGuiExtensionPage('PHP GUI Beispiel');
// Inhalt der Webseite in Bereiche aufteilen:
$layout = new GhGuiBorderContainer();
$page->addComponent($layout);
// Formular zum oberen Bereich hinzufügen (mit 'iframe.php' als Formularskript):
$form = new GhGuiForm('iframe.php');
$layout->addTopComponent($form);
// Textfeld mit dem Namen 'inputValue' zum Formular hinzufügen:
$form->addComponent(new GhGuiTextBox('inputValue'));
// Button zum Absenden des Formulars hinzufügen:
$form->addComponent(new GhGuiButton('Absenden'));
// IFrame zum mittleren Bereich hinzufügen:
$iframe = new GhGuiIframe('iframe.php');
$layout->addCenterComponent($iframe);
// IFrame als Ziel für das Formular festlegen:
$form->setTarget($iframe);
// Webseite anzeigen:
$page->show();
Beispiel eines Formulars mit IFrame - iframe.php:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<?php
// GREYHOUND PHP GUI laden:
require_once 'ghgui/ghgui.php';
// Webseite erstellen:
$page = new GhGuiExtensionPage('PHP GUI Beispiel - IFrame Inhalt');
// Die Eingabe aus den abgeschickten Formulardaten holen:
$input = GhCoreGlobals::getValue('inputValue');
// Falls das Formular abgeschickt wurde wird die Eingabe ausgegeben:
if($input !== null)
$page->addComponent(new GhGuiText('Folgender Text wurde eingegeben: ' . $input));
// Andernfalls wird ein Hinweistext ausgegeben:
else
$page->addComponent(new GhGuiText('Das Formular wurde noch nicht abgeschickt.'));
// Webseite anzeigen:
$page->show();
In diesem Beispiel wird beim Absenden des Formulars immer nur der untere Bereich im IFrame neu geladen, da die Werte des Formulars aus dem oberen Bereich in das IFrame abgeschickt werden.
In einem Formular können nicht nur Einzelkomponenten platziert werden, es können auch Strukturkomponenten innerhalb des Formulars eingesetzt werden. Wie bei HTML-Formularen gilt hier jedoch die Ausnahme, dass Formulare nicht verschachtelt werden dürfen. Es darf also kein Formular innerhalb eines anderen Formulars eingefügt werden. Dies führt bei der Anzeige der Webseite zu einer Exception. Ebenso dürfen Einzelkomponenten, die Eingaben oder Auswahl ermöglichen, nicht außerhalb von Formularen verwendet werden. Ist eine solche Komponente beim Anzeigen der Webseite nicht in einem Formular enthalten, so führt dies zu einer Exception.
Werden mehrere Buttons innerhalb des selben Formulars eingefügt, so kann beim Absenden des Formulars festgestellt werden, welches Button ausgelöst wurde, indem den Buttons Namen und optional Werte zugeordnet werden. Der Wert des Buttons, welches gedrückt wurde, wird unter dessen Namen in den Formulardaten mitgesendet. Wurde dem Button kein Wert zugewiesen, so wird dessen Beschriftung als Wert verwendet. Das folgende Beispiel zeigt diesen Mechanismus:
Beispiel für mehrere Buttons in einem Formular:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<?php
// GREYHOUND PHP GUI laden:
require_once 'ghgui/ghgui.php';
// Webseite erstellen:
$page = new GhGuiExtensionPage('PHP GUI Beispiel');
// Formular zur Webseite hinzufügen:
$form = new GhGuiForm();
$page->addComponent($form);
// Buttons mit unterschiedlichen Namen einfügen:
$button1 = new GhGuiButton('Test 1');
$button1->setName('button1');
$form->addComponent($button1);
$button2 = new GhGuiButton('Test 2');
$button2->setName('button2');
$form->addComponent($button2);
// Buttons mit gleichem Namen und unterschiedlichen Werten einfügen:
$button3 = new GhGuiButton('Test 3');
$button3->setName('buttons');
$button3->setValue('button3');
$form->addComponent($button3);
$button4 = new GhGuiButton('Test 4');
$button4->setName('buttons');
$button4->setValue('button4');
$form->addComponent($button4);
// Falls das Formular abgeschickt wurde den gedrückten Button ausgeben:
$text = new GhguiText();
$form->addComponent($text);
if(GhCoreGlobals::getValue('button1'))
$text->addText('Button "Test 1" wurde gedrückt: ' . GhCoreGlobals::getValue('button1'));
if(GhCoreGlobals::getValue('button2'))
$text->addText('Button "Test 2" wurde gedrückt: ' . GhCoreGlobals::getValue('button2'));
if(GhCoreGlobals::getValue('buttons'))
$text->addText('Folgender Button wurde gedrückt: ' . GhCoreGlobals::getValue('buttons'));
// Webseite anzeigen:
$page->show();
Buttons senden automatisch das Formular ab, in dem sie enthalten sind, es können aber auch andere Eingabekomponenten so eingestellt werden, dass sie, wenn sich ihr Wert ändert, das Formular automatisch absenden. Dieser Auto-Submit Mechanismus kann über die Methode setAutoSubmit() eingestellt werden. Das folgende Beispiel zeigt, wie ein Formular mit einer Auswahlliste erstellt wird, die beim Auswählen eines Werts das Formular absendet:
Beispiel für Auto-Submit:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<?php
// GREYHOUND PHP GUI laden:
require_once 'ghgui/ghgui.php';
// Webseite erstellen:
$page = new GhGuiExtensionPage('PHP GUI Beispiel');
// Formular zur Webseite hinzufügen:
$form = new GhGuiForm();
$page->addComponent($form);
// Auswahlliste (mit Namen 'inputValue') hinzufügen:
$list = new GhGuiList('inputValue');
$form->addComponent($list);
// Auto-Submit für die Auswahlliste aktivieren:
$list->setAutoSubmit(true);
// Elemente zur Liste hinzufügen:
$listItems = array(
array('ID' => 'item01', 'Name' => 'Test 1'),
array('ID' => 'item02', 'Name' => 'Test 2'),
array('ID' => 'item03', 'Name' => 'Test 3'),
array('ID' => 'item04', 'Name' => 'Test 4')
);
$list->addItems($listItems);
// Falls das Formular abgeschickt wurde wird die Eingabe ausgegeben:
$input = GhCoreGlobals::getValue('inputValue');
if($input !== null)
$form->addComponent(new GhGuiText('Folgendes Listenelement wurde ausgewählt: ' . $input));
// Webseite anzeigen:
$page->show();
Die Listenelemente werden hier jeweils als Arrays mit den Schlüsseln ID und Name übergeben. Dies ist die Voreinstellung für die Komponente GhGuiList (alternativ wären auch Objekte mit den Eigenschaften ID und Name möglich). Die Schlüssel, bzw. Eigenschaften für den Wert des Listen-Formularelements und die Beschriftung der Einträge kann frei gewählt werden. Näheres wird im Abschnitt Datenobjekte beschrieben.
| Themen dieser Ebene |
|---|
| 1.1.1. Webseitenaufbau |
| 1.1.2. Formulare |
| 1.1.3. Datenobjekte |
| 1.1.4. Icons |