Regeleditor für Edge Delivery Services Forms
Mit dem Regeleditor können Autoren statische Formulare in responsive, intelligente Erlebnisse umwandeln, ohne Code zu schreiben. Sie können Felder bedingt anzeigen, Berechnungen durchführen, Daten validieren, Benutzerinnen und Benutzer durch Flüsse leiten und Geschäftslogik integrieren, die sich je nach Benutzertyp anpasst.
Lerninhalt
Am Ende dieses Handbuchs können Sie:
- Verstehen, wie Regeln funktionieren und wann verschiedene Regeltypen verwendet werden sollten
- Den Regeleditor im universellen Editor aktivieren und aufrufen
- Eine bedingte Logik zum dynamischen Anzeigen oder Ausblenden von Feldern erstellen
- Automatisierte Berechnungen und Datenvalidierung implementieren
- Benutzerdefinierte Funktionen für komplexe Geschäftsregeln erstellen
- Best Practices für Leistung, Wartungsfreundlichkeit und Benutzerfreundlichkeit anwenden
Wozu dient der Regeleditor?
- Bedingte Logik: Zeigen Sie relevante Felder nur an, wenn sie benötigt werden, um Rauschen und kognitive Belastung zu reduzieren.
- Dynamische Berechnungen: Werte (Summen, Sätze, Steuern) werden je nach Benutzertyp automatisch berechnet.
- Datenvalidierung: Frühzeitige Fehlervermeidung durch Echtzeit-Prüfungen und verständliche Meldungen.
- Geleitete Erlebnisse: Benutzerinnen und Benutzer werden durch logische Schritte geführt (Assistenten, Verzweigungen).
- Erstellung ohne Code: Konfigurieren Sie effektive Verhaltensweisen über eine visuelle Oberfläche.
Gängige Szenarien sind Steuerrechner, Schätzer für Darlehen und Prämien, Fördermittelflüsse, mehrstufige Anträge und Umfragen mit bedingten Fragen.
Funktionsweise von Regeln
Eine Regel definiert, was geschehen soll, wenn eine Bedingung erfüllt ist. Grundsätzlich besteht eine Regel aus zwei Teilen:
- Bedingung: Eine Anweisung, die als „true“ oder „false“ ausgewertet wird.
- Beispiele: „Einkommen > 50.000“, „Abdeckung = Ja“, „Feld ist leer“
- Aktion: Was geschieht, wenn die Bedingung true ist (und optional, wenn sie false ist).
- Beispiele: Ein-/Ausblenden eines Felds, Festlegen/Löschen eines Werts, Validieren der Eingabe, Aktivieren/Deaktivieren einer Schaltfläche
-
Bedingung → Aktion (Wenn/Dann)
code language-text WHEN Gross Salary > 50000 THEN Show "Additional Deduction"
Am besten geeignet für bedingte Sichtbarkeit und progressive Offenlegung.
-
Aktion ← Bedingung (Festlegen wenn/Nur wenn)
code language-text SET Taxable Income = Gross Salary - Deductions IF Deductions are applicable
Am besten geeignet für Berechnungen und Datenumwandlungen.
-
Wenn → dann → Sonst (alternative Aktion)
code language-text IF Income > 50000 THEN Show "High Income" fields ELSE Show "Standard Income" fields
Am besten geeignet für Verzweigungslogik und sich gegenseitig ausschließende Flüsse.
- Bedingung: „Bruttogehalt übersteigt 50.000 Euro"
- Primäre Aktion: „Zusätzlicher Abzug“ anzeigen
- Alternative Aktion: „Zusätzlicher Abzug“ ausblenden
- Ergebnis: Benutzende sehen nur die Felder, die für sie gelten
Voraussetzungen
Grundlegende Berechtigungen und Einrichtung:
- AEM as a Cloud Service: Authoring-Zugriff mit Berechtigungen zur Formularbearbeitung
- Universeller Editor: In Ihrer Umgebung installiert und konfiguriert
- Regeleditor-Erweiterung: Aktiviert über Extension Manager
- Berechtigungen zur Formularbearbeitung: Möglichkeit zum Erstellen und Ändern von Formularkomponenten im universellen Editor
Überprüfungsschritte:
- Überprüfen Sie, ob Sie über Ihre AEM Sites-Konsole auf den universellen Editor zugreifen können.
- Überprüfen Sie, ob Sie Formularkomponenten erstellen und bearbeiten können
- Vergewissern Sie sich, dass bei der Auswahl von Formularkomponenten das Regeleditor-Symbol
Erforderliche Kenntnisse und Fähigkeiten:
- Erfahrung mit dem universellen Editor: Erfahrung beim Erstellen von Formularen mit Texteingaben, Dropdown-Menüs und grundlegenden Feldeigenschaften
- Verständnis von Geschäftslogik: Fähigkeit, bedingte Anforderungen und Validierungsregeln für Ihren spezifischen Anwendungsfall zu definieren
- Vertrautheit mit Formularkomponenten: Kenntnisse zu Feldtypen (Text, Zahl, Dropdown), Eigenschaften (erforderlich, sichtbar, schreibgeschützt) und Formularstruktur
Optional für erweiterte Nutzung:
- JavaScript-Grundlagen: Nur zum Erstellen benutzerdefinierter Funktionen (Datentypen, Funktionen, Grundsyntax) erforderlich
- JSON-Verständnis: Hilfreich bei komplexen Datenmanipulationen und API-Integrationen
Fragen zur Einschätzung:
- Können Sie im universellen Editor ein einfaches Formular mit Texteingaben und eine Senden-Schaltfläche erstellen?
- Wissen Sie, wann Felder in Ihrem Geschäftskontext erforderlich oder optional sein sollten?
- Können Sie erkennen, welche Formularelemente in Ihrem Anwendungsfall eine bedingte Sichtbarkeit erfordern?
Wichtig: Die Erweiterung „Regeleditor“ ist in Umgebungen des universellen Editors nicht standardmäßig aktiviert.
Aktivierungsschritte:
- Navigieren Sie in Ihrer AEM-Umgebung zu Extension Manager.
- Suchen Sie in der Liste der verfügbaren Erweiterungen nach der Erweiterung „Regeleditor“.
- Klicken Sie auf Aktivieren und bestätigen Sie die Aktivierung.
- Warten Sie, bis das System aktualisiert wurde (kann 1-2 Minuten dauern).
Überprüfung:
- Nach der Aktivierung wird das Regeleditor-Symbol angezeigt, wenn Sie eine Formularkomponente auswählen:
Abbildung: Das Symbol „Regeleditor“ wird angezeigt, wenn Sie Formularkomponenten auswählen.
So öffnen Sie den Regeleditor:
- Wählen Sie im universellen Editor eine Formularkomponente aus.
- Klicken Sie auf das Symbol „Regeleditor“.
- Der Regeleditor wird in einem Seitenbereich geöffnet.
Abbildung: Benutzeroberfläche des Regeleditors zum Bearbeiten von Komponentenregeln
note note |
---|
NOTE |
In diesem Artikel verweisen „Formularkomponente“ und „Formularobjekt“ auf dieselben Elemente (z. B. Eingaben, Schaltflächen, Bedienfelder). |
Übersicht über die Benutzeroberfläche des Regeleditors
Abbildung: Vollständige Benutzeroberfläche des Regeleditors mit nummerierten Komponenten
-
Komponententitel und Regeltyp: Bestätigt die ausgewählte Komponente und den aktiven Regeltyp.
-
Bedienfeld „Formularobjekte und Funktionen“
- Formularobjekte: Hierarchische Ansicht von Feldern und Containern für Verweise in Regeln
- Funktionen: integrierte Hilfsfunktionen für Mathematik, Zeichenfolge, Datum und Validierung
-
Umschalten von Bedienfeld: Ein- oder Ausblenden des Bedienfelds für Objekte und Funktionen, um den Arbeitsbereich zu vergrößern
-
Visueller Regelgenerator: Drag-and-Drop- sowie Dropdown-gesteuerter Regel-Composer
-
Steuerungen: Fertig (Speichern), Abbrechen (Verwerfen). Testen Sie Regeln immer vor dem Speichern.
Wenn eine Komponente bereits über Regeln verfügt, können Sie:
- Anzeigen: Regelzusammenfassungen und Logik ansehen
- Bearbeiten: Bedingungen und Aktionen ändern
- Neu anordnen: Ausführungsreihenfolge (von oben nach unten) ändern
- Aktivieren/Deaktivieren: Regeln für Tests umschalten
- Löschen: Regeln sicher entfernen
note tip |
---|
TIP |
Setzen Sie spezifische Regeln vor allgemeine Regeln. Die Ausführung erfolgt von oben nach unten. |
Verfügbare Regeltypen
Wählen Sie den Regeltyp aus, der am besten zu Ihren Absichten passt.
- Wenn: Primäre Regel für komplexes bedingtes Verhalten (Bedingung → Aktion ± Sonst)
- Ausblenden/Einblenden: Steuert die Sichtbarkeit basierend auf einer Bedingung (progressive Offenlegung)
- Aktivieren/Deaktivieren: Steuert, ob ein Feld interaktiv ist (deaktiviert beispielsweise „Senden“, bis alle erforderlichen Felder gültig sind)
- Wert festlegen von: Werte automatisch ausfüllen (z. B. Daten, Gesamtwerte, Kopien)
- Wert löschen von: Daten bei Änderung der Bedingungen entfernen
- Formatieren: Umwandeln der Anzeigeformatierung (Währung, Telefon, Datum) ohne Änderung der gespeicherten Werte
- Validieren: Benutzerdefinierte Validierungslogik, einschließlich feldübergreifender Prüfungen und Geschäftsregeln
- Mathematischer Ausdruck: Berechnung von Werten in Echtzeit (Summen, Steuern, Verhältnisse)
- Fokus festlegen: Fokus auf ein bestimmtes Feld verschieben (sparsam verwenden)
- Eigenschaft festlegen: Dynamisches Ändern von Komponenteneigenschaften (Platzhalter, Optionen usw.)
- Formular senden: Das Formular programmgesteuert übermitteln (nur nach erfolgreicher Überprüfung)
- Formular zurücksetzen: Löschen und auf Anfangsstatus zurücksetzen (vor der Verwendung bestätigen)
- Formular speichern: Als Entwurf für später speichern (lange Formulare, mehrere Sitzungen)
- Service aufrufen: Externe APIs/Services aufrufen (Laden und Fehler behandeln)
- Instanz hinzufügen/entfernen: Wiederholbare Abschnitte verwalten (z. B. unterhaltspflichtige Kinder, Adressen)
- Navigieren zu: Zu anderen Formularen/Seiten weiterleiten (Daten vor der Navigation beibehalten)
- Zwischen Bedienfeldern navigieren: Schrittnavigation und Überspringen im Assistenten steuern
- Ereignis auslösen: Benutzerdefinierte Trigger-Ereignisse für Integrationen oder Analysen
Schritt-für-Schritt-Tutorial: Erstellen eines intelligenten Steuerrechners
Dieses Beispiel veranschaulicht bedingte Sichtbarkeit und automatische Berechnungen.
Abbildung: Formular zur Steuerberechnung mit intelligenten bedingten Feldern
Sie erstellen ein Formular, das:
- Sich an Benutzereingaben anpasst, indem relevante Felder angezeigt werden
- Werte in Echtzeit berechnet
- Daten validiert, um die Genauigkeit zu verbessern
table 0-row-4 1-row-4 2-row-4 3-row-4 4-row-4 | |||
---|---|---|---|
Feldname | Typ | Zweck | Verhalten |
Bruttogehalt | Zahleneingabe | Jahreseinkommen der Benutzerin bzw. des Benutzers | Löst bedingte Logik aus |
Zusätzlicher Abzug | Zahleneingabe | Zusätzliche Abzüge (falls infrage kommend) | Nur sichtbar, wenn Gehalt > 50.000 Euro |
Steuerpflichtiges Einkommen | Zahleneingabe | Berechneter Wert | Schreibgeschützt, Aktualisierungen bei Änderung |
Steuerschuld | Zahleneingabe | Berechneter Wert | Schreibgeschützt, pauschal berechnet |
-
Regel 1: Bedingte Anzeige
code language-text WHEN Gross Salary > 50,000 THEN Show "Additional Deduction" ELSE Hide "Additional Deduction"
-
Regel 2: Berechnung des steuerpflichtigen Einkommens
code language-text SET Taxable Income = Gross Salary - Additional Deduction (Only when Additional Deduction applies)
-
Regel 3: Berechnung der Steuerschuld
code language-text SET Tax Payable = Taxable Income × 10% (Simplified flat rate)
Ziel: Erstellen Sie das Basisformular mit allen Feldern und Anfangseinstellungen.
-
Öffnen Sie den universellen Editor:
- Navigieren Sie zur AEM Sites-Konsole, wählen Sie Ihre Seite und klicken Sie auf Bearbeiten.
- Stellen Sie sicher, dass der universelle Editor ordnungsgemäß konfiguriert ist.
-
Fügen Sie Formularkomponenten in dieser Reihenfolge hinzu:
- Titel (H2): „Steuerberechnungsformular“
- Zahleneingabe: „Bruttogehalt“ (erforderlich: ja, Platzhalter: „Jahresgehalt eingeben“)
- Zahleneingabe: „Zusätzlicher Abzug“ (erforderlich: nein, Platzhalter: „Zusätzliche Abzüge eingeben“)
- Zahleneingabe: „Steuerpflichtiges Einkommen“ (schreibgeschützt: ja)
- Zahleneingabe: „Steuerschuld“ (schreibgeschützt: ja)
- Senden-Schaltfläche: „Steuer berechnen“
-
Konfigurieren Sie die anfänglichen Feldeigenschaften:
- „Zusätzlicher Abzug“ ausblenden (Einstellung „Sichtbar: nein“ im Bedienfeld „Eigenschaften“)
- „Steuerpflichtiges Einkommen“ und „Steuerschuld“ auf Schreibgeschützt: ja festlegen
Abbildung: Anfängliche Formularstruktur mit konfigurierten Basiskomponenten
Checkpoint: Sie sollten ein Formular mit allen Pflichtfeldern haben, in dem „Zusätzlicher Abzug“ ausgeblendet ist und berechnete Felder schreibgeschützt sind.
Ziel: Das Feld „Zusätzlicher Abzug“ wird nur angezeigt, wenn das Bruttogehalt 50.000 Euro überschreitet.
-
Wählen Sie das Feld Bruttogehalt und klicken Sie auf das Regeleditor-Symbol
-
Erstellen Sie eine neue Regel:
- Klicken Sie auf Erstellen.
- Ändern Sie den Regeltyp von „Wert festlegen von“ in "Wenn".
-
Konfigurieren Sie die Bedingung:
- Wählen Sie in der Dropdown-Liste die Option "ist größer als".
- Geben Sie
50000
in das Zahlenfeld ein.
-
Legen Sie die Dann-Aktion fest:
- Wählen Sie aus der Dropdown-Liste „Aktion auswählen“ die Option "Anzeigen" aus.
- Ziehen oder wählen Sie das Feld "Zusätzlicher Abzug"" aus den Formularobjekten aus.
-
Fügen Sie die Andernfalls-Aktion hinzu:
- Klicken Sie auf "Andernfalls-Abschnitt hinzufügen".
- Wählen Sie in der Dropdown-Liste „Aktion auswählen“ die Option "Ausblenden" aus.
- Wählen Sie das Feld "Zusätzlicher Abzug" aus.
-
Regel speichern: Klicken Sie auf Fertig.
note note |
---|
NOTE |
Alternative Methode: Sie können dasselbe Ergebnis erzielen, indem Sie eine Regel zum Ein-/Ausblenden direkt im Feld „Zusätzlicher Abzug“ anstelle einer Wenn-Regel für „Bruttogehalt“ erstellen. |
Ziel: Berechnet basierend auf der Benutzereingabe automatisch „Steuerpflichtiges Einkommen“ und „Steuerschuld“.
So konfigurieren Sie die Berechnung des steuerpflichtigen Einkommens:
-
Wählen Sie das Feld „Steuerpflichtiges Einkommen“ und öffnen Sie den Regeleditor.
-
Mathematischen Ausdruck erstellen:
- Klicken Sie auf Erstellen → wählen Sie "Mathematischer Ausdruck".
- Ausdruck erstellen: Bruttogehalt − zusätzlicher Abzug
- Ziehen Sie „Bruttogehalt“ in das erste Feld.
- Wählen Sie den Operator "Minus" aus.
- Ziehen Sie „Zusätzlicher Abzug“ in das zweite Feld.
-
Speichern: Klicken Sie auf Fertig.
Konfigurieren Sie die Berechnung der Steuerschuld:
-
Wählen Sie das Feld „Steuerschuld“ aus und öffnen Sie den Regeleditor.
-
Mathematischen Ausdruck erstellen:
- Klicken Sie auf Erstellen → wählen Sie "Mathematischer Ausdruck".
- Ausdruck erstellen: Steuerpflichtiges Einkommen × 10 ÷ 100
- Ziehen Sie „Steuerpflichtiges Einkommen“ in das erste Feld.
- Wählen Sie den Operator "Multipliziert mit" aus.
- Geben Sie
10
als Zahl ein. - Klicken Sie auf “Ausdruck erweitern“.
- Wählen Sie den Operator "dividiert durch" aus.
- Geben Sie
100
als Zahl ein.
-
Speichern: Klicken Sie auf Fertig.
Überprüfen Sie Ihre Implementierung, indem Sie den vollständigen Fluss testen:
-
Vorschau des Formulars: Klicken Sie im universellen Editor auf den Vorschaumodus.
-
Testen Sie die bedingte Logik:
- Geben Sie ein Bruttogehalt ein =
30000
→ „Zusätzlicher Abzug“ sollte ausgeblendet bleiben - Geben Sie ein Bruttogehalt ein =
60000
→ „Zusätzlicher Abzug“ sollte eingeblendet werden
- Geben Sie ein Bruttogehalt ein =
-
Testberechnungen:
- Bei Bruttogehalt =
60000
, zusätzlicher Abzug =5000
eingeben - Steuerpflichtiges Einkommen prüfen =
55000
(60000 - 5000) - Steuerschuld prüfen =
5500
(55000 × 10%)
- Bei Bruttogehalt =
Abbildung: Fertiger Steuerrechner mit bedingten Feldern und automatischen Berechnungen
Erfolgskriterien: Das Formular sollte Felder dynamisch ein-/ausblenden und Werte in Echtzeit berechnen, während Benutzerinnen und Benutzer Eingaben tätigen.
Erweitert: benutzerdefinierte Funktionen
Für komplexe Geschäftslogik, die über die integrierten Funktionen hinausgeht, können Sie benutzerdefinierte JavaScript-Funktionen erstellen, die sich nahtlos in den Regeleditor integrieren lassen.
Ideale Szenarien für benutzerdefinierte Funktionen:
- Komplexe Berechnungen: Mehrstufige Berechnungen, die in der Regel „Mathematischer Ausdruck“ nicht einfach ausgedrückt werden können
- Geschäftsspezifische Validierungen: Benutzerdefinierte Validierungslogik, die für Ihr Unternehmen oder Ihre Branche spezifisch ist
- Datenumwandlungen: Formatkonvertierungen, Bearbeitungen von Zeichenfolgen oder Datenanalysen
- Externe Integrationen: Aufrufe an interne APIs oder Services von Drittanbietern (mit Einschränkungen)
Vorteile benutzerdefinierter Funktionen:
- Wiederverwendbarkeit: Einmal schreiben, über verschiedene Formulare und Regeln hinweg verwenden
- Wartbarkeit: Zentralisierte Logik, die einfacher zu aktualisieren und zu debuggen ist
- Performance: Optimierte JavaScript-Ausführung im Vergleich zu komplexen Regelketten
- Flexibilität: Handhabung von Grenzfällen und komplexen Szenarien, die nicht von Standardregeln abgedeckt werden
Dateispeicherort: Alle benutzerdefinierten Funktionen müssen in /blocks/form/functions.js
in Ihrem Edge Delivery Services-Projekt definiert werden.
Entwicklungs-Workflow:
-
Funktionsentwurf
- Verwenden Sie beschreibende, aktionsorientierte Funktionsnamen
- Definieren Sie klare Parametertypen und Rückgabewerte
- Handhaben Sie Grenzfälle und ungültige Eingaben auf elegante Weise
-
Implementierung
- Schreiben Sie sauberes, gut kommentiertes JavaScript
- Schließen Sie Eingabevalidierung und Fehlerbehandlung ein
- Testen Sie Funktionen unabhängig vor der Integration
-
Dokumentation
- Fügen Sie umfassende JSDoc-Kommentare hinzu
- Schließen Sie Nutzungsbeispiele und Parameterbeschreibungen ein
- Dokumentieren Sie Einschränkungen oder Abhängigkeiten
-
Bereitstellung
- Exportieren Sie Funktionen mit benannten Exporten
- Stellen Sie in Ihrem Projekt-Repository bereit
- Überprüfen Sie den Build-Abschluss vor dem Testen
Beispielimplementierung:
code language-javascript |
---|
|
Abbildung: Hinzufügen benutzerdefinierter Funktionen zur Datei „features.js“
Integrationsschritte:
-
Funktion zu Projekt hinzufügen
/blocks/form/functions.js
im Projekt erstellen oder bearbeiten- Funktion in Exportanweisung aufnehmen
-
Bereitstellen und aufbauen
- Änderungen an das Repository übertragen
- Sicherstellen, dass der Build-Prozess erfolgreich abgeschlossen wurde
- Zeit für CDN-Cache-Aktualisierungen lassen
-
Aufrufen im Regeleditor
- Öffnen des Regeleditors für jede Formularkomponente
- Wählen Sie “Funktionsausgabe“ in der Dropdown-Liste Aktion auswählen.
- Wählen Sie Ihre benutzerdefinierte Funktion aus der Liste der verfügbaren Funktionen aus.
- Konfigurieren Sie Funktionsparameter mithilfe von Formularfeldern oder statischen Werten.
-
Führen Sie gründliche Tests durch.
- Sehen Sie sich zur Überprüfung des Funktionsverhaltens eine Vorschau des Formulars an.
- Testen Sie mit verschiedenen Eingabekombinationen, einschließlich Grenzfällen.
- Überprüfen Sie die Auswirkungen auf die Leistung beim Laden von und Interagieren mit Formularen.
Abbildung: Auswählen und Konfigurieren von benutzerdefinierten Funktionen in der Benutzeroberfläche des Regeleditors
Die Verbesserungen am Regeleditor, einschließlich benutzerdefinierter ereignisbasierter Regeln, Unterstützung für dynamische Variablen und API-Integration, sind auch für Edge Delivery Services Forms verfügbar. Weitere Informationen zu diesen Verbesserungen und deren Verwendung finden Sie im Artikel Verbesserungen des Regeleditors und Anwendungsfälle .
Best Practices für den Einsatz von Funktionen:
- Fehlerbehandlung: Fallback-Verhalten bei Funktionsfehlern immer einschließen
- Performance: Profilfunktionen mit realistischen Datenmengen
- Sicherheit: Alle Eingaben überprüfen, um Sicherheitslücken zu verhindern
- Testen: Testfälle für normale Fälle und Grenzfälle erstellen
Statische Importe für benutzerdefinierte Funktionen
Der Regeleditor des universellen Editors unterstützt statische Importe, sodass Sie wiederverwendbare Logik über mehrere Dateien und Formulare hinweg organisieren können. Anstatt alle benutzerdefinierten Funktionen in einer Datei (https://experienceleague.adobe.com/blocks/form/functions.js?lang=de) zu speichern, können Sie Funktionen aus anderen Modulen importieren.
Beispiel: Funktionen aus einer externen Datei importieren
Beachten Sie die folgende Ordnerstruktur:
form
┣ commonLib
┃ ┗ functions.js
┣ rules
┃ ┗ _form.json
┣ form.js
┗ functions.js
Sie können Funktionen aus commonLib/functions.js
wie unten dargestellt in Ihre functions.js
importieren:
`import {days} from './commonLib/functions';
/**
* Get Full Name
* @name getFullName Concats first name and last name
* @param {string} firstname in String format
* @param {string} lastname in String format
* @return {string}
*/
function getFullName(firstname, lastname) {
return `${firstname} ${lastname}`.trim();
}
// Export multiple functions for use in Rule Editor
export { getFullName, days};
Organisieren von benutzerdefinierten Funktionen in verschiedenen Forms
Sie können verschiedene Funktionssätze in separaten Dateien oder Ordnern erstellen und diese nach Bedarf exportieren:
-
Wenn Sie möchten, dass bestimmte Funktionen nur in bestimmten Formularen verfügbar sind, können Sie den Pfad zur Funktionsdatei in der Formularkonfiguration angeben.
-
Wenn das Textfeld für den Pfad leer gelassen wird, lädt der Regeleditor standardmäßig Funktionen aus
/blocks/form/functions.js
Im obigen Screenshot wird der Pfad der benutzerdefinierten Funktion im Textfeld Benutzerdefinierter Funktionspfad hinzugefügt. Die benutzerdefinierten Funktionen für dieses Formular werden aus der angegebenen Datei geladen (cc_function.js
).
Dies ermöglicht Flexibilität, da Funktionen über mehrere Formulare hinweg gemeinsam genutzt oder je Formular isoliert werden können.
Best Practices für die Regelentwicklung
- Regelkomplexität minimieren; umfangreiche Logik in kleine, fokussierte Regeln aufspalten
- Regeln nach Häufigkeit sortieren (am häufigsten zuerst)
- Regelsätze pro Komponente verwaltbar halten
- Wiederverwendbare benutzerdefinierte Funktionen sollten dem Duplizieren von Logik vorgezogen werden
- Sorgen Sie für klare Validierung und Inline-Feedback
- Vermeiden Sie störende visuelle Änderungen; verwenden Sie Ein-/Ausblenden sorgfältig
- Testen Sie über verschiedene Geräte und Layouts hinweg
- Testen Sie mit Grenzfällen und bekannten Werten
- Überprüfen Sie Browser-übergreifend
- Dokumentieren Sie die Absichten hinter komplexen Regeln, nicht nur die Mechanik
- Verwalten Sie ein Regelinventar für große Formulare
- Verwenden Sie konsistente Namen für Komponenten und Regeln
- Versionieren Sie benutzerdefinierte Funktionen und Tests in Nicht-Produktionsumgebungen
Fehlerbehebung bei häufigen Problemen
- Überprüfen Sie Komponentennamen und -verweise
- Überprüfen Sie die Ausführungsreihenfolge (von oben nach unten)
- Validieren Sie die Bedingungen mit bekannten Werten
- Überprüfen Sie die Browser-Konsole auf Sperrfehler
- Überprüfen Sie Operatoren und Gruppierungen (AND/OR)
- Testen Sie Ausdrucksfragmente einzeln
- Überprüfen Sie Datentypen (Zahlen vs. Zeichenfolgen)
- Vereinfachen Sie tief verschachtelter Bedingungen
- Profilieren Sie benutzerdefinierte Funktionen
- Minimieren Sie externe Aufrufe innerhalb von Regeln
- Verwenden Sie spezifische Selektoren und Verweise
- Überprüfen Sie den Dateipfad:
/blocks/form/functions.js
- Stellen Sie sicher, dass benannte Exporte korrekt sind
- Prüfen Sie, ob der Build Ihre Änderungen enthält
- Löschen Sie den Browser-Cache nach der Bereitstellung
- Validieren Sie Parametertypen und Fehlerbehandlung
- Überprüfen Sie, ob die Erweiterung „Regeleditor“ aktiviert ist
- Wählen Sie eine unterstützte Komponente aus
- Verwenden Sie einen unterstützten Browser (Chrome, Firefox, Safari)
- Überprüfen Sie, ob die erforderlichen Berechtigungen vorliegen
Wichtige Einschränkungen
note important |
---|
IMPORTANT |
Einschränkungen bei benutzerdefinierten Funktionen: |
|
note warning |
---|
WARNING |
Überlegungen zur Produktion: |
|
Zusammenfassung
Der Regeleditor im universellen Editor wandelt statische Formulare in intelligente, responsive Erlebnisse um, die sich in Echtzeit an Benutzereingaben anpassen. Durch den Einsatz von bedingter Logik, automatisierten Berechnungen und benutzerdefinierten Geschäftsregeln können Sie ausgeklügelte Formular-Workflows einrichten, ohne Anwendungs-Code schreiben zu müssen.
Wichtige Merkmale, die Sie gelernt haben:
- Bedingte Logik: Felder werden je nach Benutzereingaben ein- oder ausgeblendet, sodass fokussierte, relevante Erlebnisse entstehen
- Dynamische Berechnungen: Werte (Steuern, Gesamtsummen, Sätze) werden automatisch berechnet, wenn Benutzende mit dem Formular interagieren
- Datenvalidierung: Es wird eine Echtzeit-Validierung mit klaren, umsetzbaren Feedback-Meldungen implementiert
- Benutzerdefinierte Funktionen: Erweitern von Funktionen mit JavaScript für komplexe Geschäftslogik und Integrationen
- Leistungsoptimierung: Anwenden von Best Practices für eine verwaltbare, effiziente Regelentwicklung
Wert bereitgestellt:
- Verbessertes Anwendererlebnis: Verringerung kognitiver Belastung durch progressive Offenlegung und intelligente Formularflüsse
- Weniger Fehler: Verhindern ungültiger Übermittlungen durch Echtzeit-Validierung und geführte Eingaben
- Verbesserte Effizienz: Automatisierung von Berechnungen und Dateneingaben zur Minimierung des Benutzeraufwands
- Wartbare Lösungen: Erstellung von wiederverwendbaren, gut dokumentierten Regeln, die in Ihrem gesamten Unternehmen skaliert werden können
Geschäftliche Auswirkungen:
Formulare werden zu effektiven Tools für die Datenerfassung, Lead-Qualifizierung und Benutzerinteraktion. Der Regeleditor ermöglicht es technisch nicht versierten Autorinnen und Autoren, eine ausgeklügelte Geschäftslogik zu implementieren. Dadurch werden die Entwicklungskosten gesenkt und gleichzeitig die Formularausfüllungsraten und die Datenqualität verbessert.
Nächste Schritte
Empfohlener Lernpfad:
- Mit den Grundlagen beginnen: Erstellen Sie einfache Regeln für Einblenden/Ausblenden, um die grundlegenden Konzepte zu verstehen.
- Mit Tutorials üben: Verwenden Sie das Beispiel des Steuerrechners als Grundlage für Ihre eigenen Formulare.
- Schrittweise erweitern: Fügen Sie mathematische Ausdrücke und Validierungsregeln hin, sobald Sie sich sicherer fühlen.
- Benutzerdefinierte Funktionen implementieren: Entwickeln Sie JavaScript-Funktionen für spezielle Geschäftsanforderungen.
- Optimieren und skalieren: Wenden Sie Best Practices für Leistung an und pflegen Sie eine Regeldokumentation.
Zusätzliche Ressourcen:
- Dokumentation zum universellen Editor für zusätzlichen Kontext
- Extension Manager-Handbuch zur Aktivierung zusätzlicher Funktionen
- Edge Delivery Services-Formulare für eine umfassende Anleitung zur Formularentwicklung