Binden Sie ein Event an eine Komponente

Binden Sie Datenelemente in UI Builder, damit Sie Ihren Komponenten Event-Aktionen hinzufügen können.

Vorbereitungen

Erforderliche Rolle: ui_builder_admin

Warum und wann dieser Vorgang ausgeführt wird

Jede Komponente hat bestimmte Events, an die sie gebunden ist. Zum Beispiel hat eine Schaltflächenkomponente nur ein Ereignis, bei dem auf eine Schaltfläche geklickt wurde, während anderen Komponenten mehrere Ereignisse zugeordnet sein können.

Einige Komponenten verfügen nicht über eine Event-Aktion, die auf sie angewendet wird. Ein Beispiel ist die Überschriftenkomponente. Viele Komponenten erfordern, dass Sie Ihrer Komponente ein Event zuordnen, damit sie eine Aktion ausführt, z. B. Daten laden.

Um Aktionen zu Komponenten, Seiten und Datenressourcen auf Ihrer Seite hinzuzufügen, können Sie einen Event-Handler hinzufügen. Eine Schaltflächenkomponente, die Sie einer Seite hinzufügen, ist statisch. Durch die Bindung einer Event-Aktion an die Schaltfläche können Sie sie mit einer Webseite verknüpfen.

Prozedur

1. Navigieren zu Alle > Now-Experience-Framework > UI Builder.
2. Öffnen Sie eine Experience, um in zu arbeiten, oder erstellen Sie eine Experience, indem Sie + Erstellenwählen.
   Weitere Informationen finden Sie unter Konfigurieren Sie, wie Benutzer mit Ihren Anwendungen in interagieren UI Builder.
3. Erstellen oder öffnen Sie eine Seite.
   Weitere Informationen zum Erstellen einer Seite in UI Builderfinden Sie unter Seiten in UI Builder erstellen.
4. Fügen Sie eine Komponente mit Events hinzu, an die sie an Ihre Seite gebunden werden kann, z. B. eine Schaltfläche.
   Weitere Informationen zum Hinzufügen von Komponenten zu einer Seite finden Sie unter Fügen Sie Komponenten hinzu, und konfigurieren Sie sie.
5. Um Ihrer Komponente einen Event-Handler hinzuzufügen, wählen Sie die Registerkarte Events aus.
   Weitere Informationen zum Hinzufügen von Event-Handlern zu Ihrer Komponente finden Sie unter Aktionen auf UI Builder-Seiten verwalten (erweiterte Funktion).
   1. Um mit dem Einrichten eines Event-Handlers für Ihre Komponente zu beginnen, klicken Sie auf + Event-Zuordnung hinzufügen.
      
   2. Wählen Sie in der Liste eine Event-Zuordnung aus, die Sie konfigurieren möchten.
      
   3. Wählen Sie im Vorschaubereich für Event-Handler einen Event-Handler aus, der an Ihre Komponente gebunden werden soll.
      
   4. Konfigurieren Sie den Event-Handler, und klicken Sie abschließend auf Hinzufügen.
      Sie konfigurieren jeden Event-Handler je nach Aktion des Events unterschiedlich. Wenn Sie beispielsweise einen Ereignishandler für eine Schaltflächenkomponente hinzufügen, können Sie auswählen, was diese Schaltflächenaktion ausführt.
6. Wahlweise: Wenn ein Modal für Ihr Event angezeigt werden soll, fügen Sie das Modal der Seite hinzu, bevor Sie Ihr Event an die Komponente binden.
   Ein Modal ist ein Bestätigungsfenster, das angezeigt wird, wenn Sie auf die Komponente klicken. Wenn Sie beispielsweise eine Schaltflächenkomponente hinzufügen, die einen Datensatz löscht, fügen Sie ein Modal hinzu, um den Benutzer aufzufordern, zu bestätigen, dass der Benutzer den Datensatz löschen möchte. Weitere Informationen finden Sie unter Modales Element zu Komponente hinzufügen.
   1. Wählen Sie in der Inhaltsstruktur neben Modals das Symbol +aus.
      
   2. Wählen Sie einen modalen Typ wie Bestätigenaus.
      
   3. Konfigurieren Sie das Modal.
      Sie können den Text im Modal, die Namen der Schaltflächen im Modal und die Größe des modalen Bildschirms ändern. Sie können auch Aktionen für das Modal festlegen. Wenn Sie die Konfiguration des Modals abgeschlossen haben, schließen Sie es. Beachten Sie, dass sich das von Ihnen erstellte Modal über dem Textkörper Ihrer Seitenstruktur in der Inhaltsstruktur befindet.
7. Binden Sie ein Event an eine Schaltflächenkomponente.
   Sie binden ein Event an die Schaltfläche, um eine Aktion auszulösen. Wählen Sie die Schaltflächenkomponente aus, um sie erneut hervorzuheben, entweder in der Inhaltsstruktur oder auf der Seite.
   1. Wählen Sie in der Inhaltsstruktur + Komponente hinzufügen aus.
   2. Wählen Sie in der Toolbox die Komponente Schaltfläche aus.
   3. Wählen Sie Keine aus, wenn Sie aufgefordert werden, eine Voreinstellung auszuwählen.
   4. Klicken Sie im Konfigurationsbereich auf Events.
   5. Wählen Sie + Event-Handler hinzufügen.
      

      Der Schaltflächenkomponente ist nur das Ereignis „Schaltfläche angeklickt“ zugeordnet. Andere Komponenten können mehr als ein Event haben.

   6. Wählen Sie eine Aktion aus, die Sie der Komponente zuweisen möchten.

      Um beispielsweise einen Event Handler für die Schaltflächenkomponente hinzuzufügen, können Sie sie mit einem anderen Ziel verknüpfen und Warnungsbenachrichtigungen hinzufügen. In diesem Beispiel können Sie Modalen Dialog öffnen oder schließen wählen, damit die Schaltfläche das zuvor erstellte modale Dialogfeld öffnet. Wählen Sie in diesem Schaltflächenszenario den Event Handler des modalen Dialogfelds Bestätigen und löschen aus, den Sie zuvor erstellt haben.

      

   7. Aktivieren Sie die Dialogfeldauswahl „Modal öffnen“, damit das Dialogfeld geöffnet wird, wenn ein Benutzer auf die Schaltflächenkomponente klickt.
   8. Um den modalen Event Handler zu Ihrer Komponente hinzuzufügen, klicken Sie auf Hinzufügen.
8. Klicken Sie auf Speichern.
9. Testen Sie das Modal, indem Sie Vorschauauswählen.
10. Um das von Ihnen erstellte Modal auszulösen, klicken Sie auf die Schaltfläche auf der Seite.