Overview
Diese Anleitung erklärt, wie man benutzerdefinierte Felderereignisse in ChronoForms 8 mit Triggern und Listenern einrichtet. Sie führt durch ein praktisches Beispiel, bei dem ein Textbereich beim Laden der Seite ausgeblendet und angezeigt wird, wenn eine bestimmte Radio-Option ausgewählt ist. Die Schritt-für-Schritt-Anleitung behandelt das Erstellen von Triggern für Seitenlade- und Wertänderungsereignisse und das anschließende Konfigurieren von Listenern, um den Textbereich entsprechend auszublenden oder anzuzeigen.
Manchmal müssen Sie Felder oder Abschnitte Ihres Formulars basierend auf den Werten anderer Formularfelder ein-/ausblenden, deaktivieren/aktivieren. Hier erfahren Sie, wie Sie die Verhaltensweisen Trigger und Listener verwenden, um benutzerdefinierte Felderereignisse in Chronoforms8 einzurichten.
In unserem Beispiel möchten wir einen Textbereich standardmäßig ausblenden, wenn das Formular geladen wird, und ihn anzeigen, wenn der Benutzer die 2. Option in einem Radiofeld auswählt. Dafür stellen wir fest, dass wir 2 Ereignisse haben:
- Seitenladen, dies wird das erste Trigger-Ereignis sein
- Wertänderung des Radiofeldes, dies wird der 2. Trigger sein
Lassen Sie uns unseren ersten Trigger erstellen, hier sind die Schritte:
- Öffnen Sie das Dropdown-Menü "Verhaltensweisen" in den Einstellungen Ihres Textbereichs
- Aktivieren Sie "Ereignis-Trigger"
- Fügen Sie einen neuen Trigger hinzu
- Stellen Sie sicher, dass er auf "Document Ready" gesetzt ist. Dieses Ereignis wird ausgelöst, wenn die Seite geladen wird
- Geben Sie einen Triggernamen ein, in diesem Fall wählen wir "hide_textarea"
Jetzt wird ein Trigger namens "hide_textarea" ausgelöst, wenn die Seite geladen wird.
Dann müssen wir den Textbereich so konfigurieren, dass er ausgeblendet wird, wenn dieser Trigger ausgelöst wird. So geht das:
- Aktivieren Sie "Ereignis-Listener" unter Verhaltensweisen.
- Klicken Sie auf "Listener hinzufügen"
- Setzen Sie "Bei Auslösen von" auf den Triggernamen, auf den wir hören möchten, in diesem Fall "hide_textarea"
- Setzen Sie die "Auszuführende Aktion" auf "ausblenden"
Da sich unser Listener im Textbereich befindet, wird dieser den Textbereich ausblenden, wenn der Trigger läuft. Wir könnten aber auch auf diesen Trigger in jedem anderen Feld hören.
Jetzt müssen wir einen neuen Trigger einrichten, der ausgelöst wird, wenn der Wert unseres Radiofeldes auf die 2. Option gesetzt wird. So geht das:
- Öffnen Sie die Einstellungen des Radiofeldes und aktivieren Sie die Verhaltensweise "Ereignis-Trigger"
- Fügen Sie einen neuen Trigger hinzu
- Setzen Sie "Bei" auf "Wert in"
- Setzen Sie die Werte auf "ck2", was die 2. Radiofeld-Option ist. Wir möchten, dass der Trigger ausgelöst wird, wenn diese Option ausgewählt ist
- Geben wir unserem Trigger den Namen "show_textarea"
Jetzt haben wir einen neuen Trigger namens "show_textarea", der ausgelöst wird, wenn unsere 2. Radio-Option ausgewählt ist.
Wir müssen nur auf diesen neuen Trigger in unserem Textbereich hören, um den Textbereich anzuzeigen, wenn er ausgelöst wird.
Also zurück zu den Einstellungen unseres Textbereichs. Wir müssen einen neuen Listener hinzufügen:
- Wir fügen einen neuen Listener hinzu
- Wir setzen den Triggernamen auf "show_textarea"
- Wir setzen die "Aktion" auf "anzeigen"
Jetzt wird unser Textbereich angezeigt, sobald die 2. Radiofeld-Option ausgewählt ist.
Comments:
How can I hide and show a container instead of a text area? The container doesn't have triggers, and I need to hide it when the form loads
Hi
You use another element's trigger and hide the container using a Listener in the container itself