Last update: Thu May 04 2023 00:00:00 GMT+0000 (Coordinated Universal Time)
AEM 6.4 hat das Ende der erweiterten Unterstützung erreicht und diese Dokumentation wird nicht mehr aktualisiert. Weitere Informationen finden Sie in unserer
technische Unterstützung. Unterstützte Versionen suchen
here.
Formulare (adaptive Formulare und HTML5-Formulare) verwenden jQuery-, Backbone.js- und Underscore.js-Bibliotheken für das Erscheinungsbild und die Skripterstellung. Die Formulare verwenden auch die Architektur von jQuery UI-Widgets für alle interaktiven Elemente (beispielsweise Felder und Schaltflächen) im Formular. Diese Architektur ermöglicht es dem Formularentwickler, einen umfangreichen Satz verfügbarer jQuery-Widgets und -Plug-ins in Forms zu verwenden. Sie können ebenfalls formularspezifische Logik beim Erfassen von Benutzerdaten implementieren, wie etwa „leadDigits/trailDigits“-Einschränkungen, oder Bildklassen implementieren. Formularentwickler können benutzerdefinierte Erscheinungsbilder erstellen und verwenden, um die Datenerfassung zu verbessern und sie benutzerfreundlicher zu gestalten.
Dieser Artikel richtet sich an Entwickler mit ausreichenden Kenntnissen von jQuery- und jQuery-Widgets. Es bietet Einblicke in das Erscheinungsbild-Framework und ermöglicht es Entwicklern, ein alternatives Erscheinungsbild für ein Formularfeld zu erstellen.
Das Erscheinungsbild-Framework nutzt verschiedene Optionen, Ereignisse (Trigger) und Funktionen zum Erfassen von Benutzerinteraktionen mit dem Formular und reagiert auf Modelländerungen, um den Endbenutzer zu informieren. Zusätzlich gilt Folgendes:
- Das Framework bietet eine Reihe von Optionen für das Erscheinungsbild eines Felds. Diese Optionen sind Schlüssel-Wert-Paare und in zwei Kategorien unterteilt: allgemeine Optionen und feldtypspezifische Optionen.
- Das Erscheinungsbild Trigger als Teil des Vertrags eine Reihe von Ereignissen wie "enter"und "exit".
- Das Erscheinungsbild ist erforderlich, um eine Reihe von Funktionen zu implementieren. Einige Funktionen sind häufig, während andere für Feldfunktionen spezifisch sind.
Allgemeine Optionen common-options
Im Folgenden finden Sie die globalen Optionen. Diese Optionen stehen für jedes Feld zur Verfügung.
name
Ein Bezeichner, mit dem dieses Objekt oder Ereignis in Skriptausdrücken angegeben wird. Diese Eigenschaft gibt beispielsweise den Namen der Host-Anwendung an.
value
Tatsächlicher Wert des Felds.
displayValue
Der Wert des Felds wird angezeigt.
screenReaderText
Reader des Bildschirms verwenden diesen Wert, um Informationen über das Feld zu beschreiben. Das Formular gibt den Wert an. Sie können diesen Wert überschreiben.
tabIndex
Die Position des Felds in der Tab-Abfolge des Formulars. Überschreiben Sie den tabIndex nur, wenn Sie die Standardreihenfolge der Registerkarten im Formular ändern möchten.
role
Rolle des Elements, z. B. Überschrift oder Tabelle.
Höhe
Die Höhe des Widgets. Sie wird in Pixel angegeben.
width
Die Breite des Widgets. Sie wird in Pixel angegeben.
access
Steuerelemente für den Zugriff auf den Inhalt eines Containers, z. B. eines Teilformulars.
paraStyles
Die para -Eigenschaft eines XFA-Elements für das Widget.
dir
Die Richtung des Textes. Mögliche Werte sind "ltr"(von links nach rechts) und "rtl"(von rechts nach links).
Zusätzlich zu diesen Optionen stellt das Framework einige andere Optionen bereit, die je nach Typ des Felds variieren. Die Details zu den feldspezifischen Optionen sind unten aufgeführt.
Um mit dem Formularframework zu interagieren, löst ein Widget einige Ereignisse aus, die das Formularskript aktivieren. Wenn das Widget diese Ereignisse nicht ausgibt, funktionieren einige Skripte nicht, die im Formular für dieses Feld geschrieben wurden.
XFA_ENTER_EVENT
Das Ereignis wird ausgelöst, wenn das Feld im Fokus ist. Dadurch kann das Skript "enter"auf dem Feld ausgeführt werden. Die Syntax zum Auslösen des Ereignisses lautet
(Widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_ENTER_EVENT)
XFA_EXIT_EVENT
Dieses Ereignis wird ausgelöst, wenn der Benutzer das Feld verlässt. Dadurch kann die Engine den Wert des Felds festlegen und ihr "exit"-Skript ausführen. Die Syntax zum Auslösen des Ereignisses lautet
(Widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_EXIT_EVENT)
XFA_CHANGE_EVENT
Dieses Ereignis wird ausgelöst, damit die Engine das "change"-Skript ausführen kann, das in das Feld geschrieben wurde. Die Syntax zum Auslösen des Ereignisses lautet
(Widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_CHANGE_EVENT)
XFA_CLICK_EVENT
Das Ereignis wird ausgelöst, wenn das Feld angeklickt wird. Dadurch kann die Engine das "click"-Skript ausführen, das in das Feld geschrieben wurde. Die Syntax zum Auslösen des Ereignisses lautet
(Widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_CLICK_EVENT)
Die Erscheinungsbild-Framework ruft einige Funktionen des Widgets auf, die in den benutzerdefinierten Widgets implementiert sind. Das Widget muss die folgenden Funktionen implementieren:
focus: function()
Fokus wird auf das Feld gelegt.
click: function()
Setzt den Fokus auf das Feld und ruft XFA_CLICK_EVENT auf.
markError:function(errorMessage, errorType)
errorMessage: string steht für den Fehler
errorType: string (“warning”/”error”)
Hinweis: Gilt nur für HTML5-Formulare.
Sendet Fehlermeldung und Fehlertyp an das Widget. Das Widget zeigt den Fehler an.
clearError: function()
Hinweis: Gilt nur für HTML5-Formulare.
Wird aufgerufen, wenn die Fehler im Feld behoben sind. Das Widget blendet den Fehler aus.
Optionen je nach Feldtyp options-specific-to-type-of-field
Alle benutzerdefinierten Widgets sollten mit den oben genannten Spezifikationen übereinstimmen. Um die Funktionen von verschiedenen Feldern zu nutzen, muss das Widget den Richtlinien des jeweiligen Felds entsprechen.
TextEdit: Textfeld textedit-text-field
multiline
True , wenn das Feld die Eingabe eines Zeilenumbruchzeichens unterstützt, andernfalls false.
maxChars
Maximale Zeichenanzahl, die in das Feld eingegeben werden kann.
limitLengthToVisibleArea
Hinweis: Gilt nur für HTML5-Formulare
Gibt das Verhalten des Textfelds an, wenn die Textbreite die Breite des Widgets überschreitet.
ChoiceList: DropDownList, ListBox choicelist-dropdownlist-listbox
Wert
Array der ausgewählten Werte.
Elemente
Array von Objekten, die als Optionen angezeigt werden sollen. Jedes Objekt enthält zwei Eigenschaften:
save: Wert zum Speichern, anzeigen: anzuzeigenden Wert.
standardmäßig als bearbeitbar
Hinweis: Gilt nur für HTML5-Formulare.
Wenn der Wert "true"ist, wird der benutzerdefinierte Texteintrag im Widget aktiviert.
displayValue
Array von anzuzeigenden Werten.
multiselect
"True", wenn mehrere Auswahlen zulässig sind, andernfalls "false".
API api
addItem: function(itemValues)
itemValues: Objekt, das den Wert "display"und "save"enthält
{sDisplayVal: <displayvalue>, sSaveVal: <save value="">}
Fügt der Liste ein Element hinzu.
deleteItem : function(nIndex)
nIndex: Index des Elements, das aus der Liste entfernt werden soll
Löscht eine Option aus der Liste.
clearItems: function()
Löscht alle Optionen aus der Liste.
NumericEdit: NumericField, DecimalField numericedit-numericfield-decimalfield
dataType
Zeichenfolge, die den Datentyp des Felds darstellt (Ganzzahl/Dezimalzahl).
leadDigits
Maximale führende Stellen in der Dezimalzahl.
fracDigits
Maximale Bruchzahlen in der Dezimalzahl.
zero
Zeichenfolgendarstellung von null im Gebietsschema des Felds.
decimal
Zeichenfolgendarstellung der Dezimalzahl im Gebietsschema des Felds.
values
Array von Werten (ein/aus/neutral).
Es handelt sich um ein Array von Werten für die verschiedenen Status von checkButton. values[0] ist der Wert, wenn der Status EIN ist, value[1] der Wert, wenn der Status AUS ist;
value[2] ist der Wert, wenn der Status NEUTRAL ist. Die Länge des Werte-Arrays entspricht dem Wert der Statusoption.
states
Anzahl der zulässigen Status.
Zwei für adaptive Formulare (Ein, Aus) und drei für HTML5-Formulare (Ein, Aus, Neutral).
state
Aktueller Status des Elements.
Zwei für adaptive Formulare (Ein, Aus) und drei für HTML5-Formulare (Ein, Aus, Neutral).
DateTimeEdit: (DateField) datetimeedit-datefield
Tage
Lokalisierte Tagesnamen für dieses Feld.
Monate
Lokalisierte Monatsnamen für dieses Feld.
zero
Der lokalisierte Text für die Zahl 0.
clearText
Der lokalisierte Text für die Schaltfläche "Löschen".