Prototypen für Formulare mit Pflichtfeldern

In diesem Artikel erfahren Sie, wie Sie Prototypen von Formularen mit Pflichtfeldern erstellen können.

So bauen Sie es auf:

Siehe

• Platzieren Sie aus den „Interaktiven Eingabefeldern“ drei „Eingabe-Textfelder“ auf der Leinwand.
• Wählen Sie „Text“ und setzen Sie jeweils einen neben ein „Eingabe-Textfeld“ und schreiben Sie „Name“, „Telefonnummer“ und „Email-Adresse“.
• Platzieren Sie einen neuen „Text“ neben dem ersten „Eingabetextfeld“ und schreiben Sie Ihre Fehlermeldung; dieser Fehler prüft, ob das erste Eingabefeld leer ist; wenn dieser Text ausgewählt ist, gehen Sie zur Palette Eigenschaften und klicken Sie auf das Symbol „In der Simulation ausgeblendet“.
• Platzieren Sie einen neuen „Text“ unter Ihrem letzten „Eingabe-Textfeld“ für die Überprüfung der E-Mail-Adresse, gehen Sie zur Palette Eigenschaften und klicken Sie auf das Symbol „In der Simulation verborgen“.
• Setzen Sie unten einen „Button“ ein, um Ihr Formular abzuschließen.

Ereignisse

Wenn Sie die Schaltfläche ausgewählt haben, gehen Sie zurück zur Palette Ereignisse und klicken Sie auf „Ereignis hinzufügen“.

1. Klicken Sie in dem Dialogfeld auf „Auslöser wählen“, bewegen Sie den Mauszeiger über den Abschnitt „Maus“ und wählen Sie „bei Klick“.
2. Wählen Sie unter „Aktion wählen“ die Option „Ausgeblendetes Element anzeigen“ und wählen Sie den Namen Validierung ausgeblendeter Text. Klicken Sie auf „Ok“, um die Erstellung des Ereignisses abzuschließen.

Gehen Sie zur Palette Ereignisse und klicken Sie auf „Bedingung hinzufügen“, um den Expression Builder zu öffnen.
Ziehen Sie den Namen „Eingabe-Textfeld“ in den offenen Bereich des Ausdrucks; ziehen Sie dann eine Logikfunktion „Gleich“ (=) und lassen Sie das nächste Feld leer. Wenn die Eingabe „Name“ leer ist, wird die Fehlermeldung angezeigt. Klicken Sie auf „Ok“, um die Erstellung des Ausdrucks abzuschließen.

Gehen Sie zurück zur Palette „Ereignisse“ und klicken Sie auf „Sonst“.

1. Klicken Sie in dem Dialogfeld auf „Auslöser wählen“, bewegen Sie den Mauszeiger über den Abschnitt „Maus“ und wählen Sie „bei Klick“.
2. Wählen Sie unter „Aktion wählen“ die Option „Element ausblenden“ und klicken Sie auf die Fehlermeldung. Klicken Sie auf „Ok“, um die Erstellung des Ereignisses abzuschließen (wenn das Feld „Name“ vollständig ist, verschwindet die Fehlermeldung, wenn Sie auf die Schaltfläche „Absenden“ klicken).
   

Wenn Sie die Schaltfläche ausgewählt haben, gehen Sie zur Palette Ereignisse und klicken Sie auf „Interaktion hinzufügen“.

1. Klicken Sie in dem Dialogfeld auf „Auslöser wählen“, bewegen Sie den Mauszeiger über den Abschnitt „Maus“ und wählen Sie „bei Klick“.
2. Wählen Sie unter „Aktion wählen“ die Option „Verstecktes Element anzeigen“ und wählen Sie den versteckten Text für die E-Mail-Validierung. Klicken Sie auf „Ok“, um die Erstellung des Ereignisses abzuschließen.

Gehen Sie zur Palette „Ereignisse“ und klicken Sie auf „Bedingung hinzufügen“, um den Expression Builder zu öffnen.
Ziehen Sie eine „Not“-Funktion, dann die logische Funktion „RegExp“ und im folgenden Feld die E-Mail-Validierung „Eingabe-Textfeld“, zuletzt auf der Registerkarte „Konstante“ den regulären Ausdruck „@“. Klicken Sie auf „Ok“, um die Erstellung des Ausdrucks abzuschließen.

Gehen Sie zurück zur Palette „Ereignisse“ und klicken Sie auf „Sonst“.

1. Klicken Sie in dem Dialogfeld auf „Auslöser wählen“, bewegen Sie den Mauszeiger über den Abschnitt „Maus“ und wählen Sie „bei Klick“.
2. Wählen Sie unter „Aktion wählen“ die Option „Element ausblenden“ und klicken Sie auf die Fehlermeldung der E-Mail-Validierung. Klicken Sie auf „Ok“, um die Erstellung des Ereignisses abzuschließen (wenn das Feld „E-Mail“ ausgefüllt ist, verschwindet die Fehlermeldung, wenn Sie auf die Schaltfläche „Senden“ klicken).

Simulieren Sie Ihren Prototyp.