Last update: Thu May 04 2023 00:00:00 GMT+0000 (Coordinated Universal Time)
AEM 6.4 har nått slutet på den utökade supporten och denna dokumentation är inte längre uppdaterad. Mer information finns i
teknisk supportperiod. Hitta de versioner som stöds
här.
Forms (adaptiva formulär och HTML 5-formulär) använder jQuery, Backbone.js och Understreck.js bibliotek för utseende och skript. Formulären använder också jQuery-gränssnitt Widgetar arkitektur för alla interaktiva element (till exempel fält och knappar) i formuläret. Med den här arkitekturen kan formulärutvecklare använda en mängd tillgängliga jQuery-widgetar och plugin-program i Forms. Du kan också implementera formulärspecifik logik samtidigt som du hämtar in data från användare som leadDigits/trailDigits-restriktioner eller implementerar bildklausuler. Formulärutvecklare kan skapa och använda anpassade utseenden för att förbättra datainhämtningen och göra den mer användarvänlig.
Den här artikeln är avsedd för utvecklare med tillräcklig kunskap om jQuery- och jQuery-widgetar. Den ger insikt i utseenderamverket och gör det möjligt för utvecklare att skapa ett alternativt utseende för ett formulärfält.
Utseenderamverket bygger på olika alternativ, händelser (utlösare) och funktioner för att fånga upp användarinteraktioner med formuläret och svarar på modelländringar för att informera slutanvändaren. Dessutom:
- Ramverket innehåller en uppsättning alternativ för utseendet på ett fält. Dessa alternativ är nyckelvärdepar och indelade i två kategorier: vanliga alternativ och fälttypspecifika alternativ.
- Utseendet, som en del av kontraktet, utlöser en uppsättning händelser som enter och exit.
- Utseendet krävs för att implementera en uppsättning funktioner. Vissa funktioner är vanliga medan andra är specifika för fälttypsfunktioner.
Vanliga alternativ common-options
Här följer de angivna globala alternativen. Dessa alternativ är tillgängliga för alla fält.
name
En identifierare som används för att ange objektet eller händelsen i skriptuttryck. Den här egenskapen anger till exempel namnet på värdprogrammet.
value
Faktiskt värde för fältet.
displayValue
Fältets värde visas.
screenReaderText
Skärm Reader använder det här värdet för att lägga till en berättarinformation om fältet. Formuläret innehåller värdet och du kan åsidosätta värdet.
tabIndex
Fältets position i formulärets tabbsekvens. Åsidosätt bara tabIndex om du vill ändra standardtabbordningen för formuläret.
roll
Elementets roll, till exempel Rubrik eller Tabell.
height
Widgetens höjd. Den anges i pixlar.
width
Widgetens bredd. Den anges i pixlar.
åtkomst
Kontroller som används för att komma åt innehållet i ett behållarobjekt, t.ex. ett delformulär.
paraStyles
Paraegenskapen för ett XFA-element till widgeten.
dir
Textens riktning. Möjliga värden är ltr (vänster till höger) och rtl (höger till vänster).
Förutom dessa alternativ innehåller ramverket några andra alternativ som varierar beroende på fälttypen. Information om fältsspecifika alternativ visas nedan.
För att interagera med formulärramverket utlöser en widget vissa händelser som gör att formulärskriptet kan fungera. Om widgeten inte genererar dessa händelser fungerar inte vissa av skripten som är skrivna i formuläret för det fältet.
XFA_ENTER_EVENT
Den här händelsen utlöses när fältet är i fokus. Det gör att skriptet "enter" kan köras på fältet. Syntaxen för att utlösa händelsen är
(widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_ENTER_EVENT)
XFA_EXIT_EVENT
Den här händelsen utlöses när användaren lämnar fältet. Det gör att motorn kan ställa in fältets värde och köra dess "exit"-skript. Syntaxen för att utlösa händelsen är
(widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_EXIT_EVENT)
XFA_CHANGE_EVENT
Den här händelsen utlöses för att motorn ska kunna köra "change"-skriptet som skrivits i fältet. Syntaxen för att utlösa händelsen är
(widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_CHANGE_EVENT)
XFA_CLICK_EVENT
Den här händelsen utlöses när användaren klickar på fältet. gör att motorn kan köra klickskriptet som skrivits i fältet. Syntaxen för att utlösa händelsen är
(widget)._trigger(xfalib.ut.XfaUtil.prototype.XFA_CLICK_EVENT)
Utseenderamverket anropar vissa funktioner i widgeten som implementeras i de anpassade widgetarna. Widgeten måste implementera följande funktioner:
fokus: function()
Fokuserar på fältet.
klicka: function()
Fokuserar på fältet och anropar XFA_CLICK_EVENT.
markError:function(errorMessage, errorType)
errorMessage: string som representerar felet
errorType: string ("warning"/"error")
Anteckning: Gäller endast för HTML5-formulär.
Skickar felmeddelande och feltyp till widgeten. Widgeten visar felet.
clearError: function()
Anteckning: Gäller endast för HTML5-formulär.
Anropas om felen i fältet är åtgärdade. Widgeten döljer felet.
Alternativ som är specifika för fälttyp options-specific-to-type-of-field
Alla anpassade widgetar ska följa ovanstående specifikationer. Om du vill använda funktionerna i olika fält måste widgeten följa riktlinjerna för det specifika fältet.
TextEdit: Textfält textedit-text-field
flerradig
True if the field supports in a newline character, else false.
maxChars
Maximalt antal tecken som kan anges i fältet.
limitLengthToVisibleArea
Anteckning: Gäller endast för HTML5-formulär
Anger textfältets beteende när textbredden överskrider bredden på widgeten.
ChoiceList: DropDownList, ListBox choicelist-dropdownlist-listbox
value
Array med valda värden.
objekt
Array med objekt som ska visas som alternativ. Varje objekt innehåller två egenskaper -
spara: värde att spara, visa: värde som ska visas.
redigerbar
Anteckning: Gäller endast för HTML5-formulär.
Om värdet är true aktiveras anpassad textinmatning i widgeten.
displayValue
Array med värden som ska visas.
multiselect
True if multiple selections are allowed, else false.
API api
addItem: function(itemValues)
itemValues: objekt som innehåller visnings- och sparningsvärdet
{sDisplayVal: <displayvalue>, sSaveVal: <save value="">}
Lägger till ett objekt i listan.
deleteItem : function(nIndex)
nIndex: index för det objekt som ska tas bort från listan
Tar bort ett alternativ från listan.
clearItems: function()
Tar bort alla alternativ från listan.
NumericEdit: NumericField, DecimalField numericedit-numericfield-decimalfield
dataType
Sträng som representerar fältets datatyp (heltal/decimal).
leadDigits
Högsta tillåtna radavståndssiffror i decimaltal.
fracDigits
Högsta tillåtna decimaltal i bråktal.
noll
Strängbeteckning för noll i fältets nationella inställningar.
decimal
Strängbeteckning för decimal i fältets nationella inställningar.
values
Array med värden (på/av/neutral).
Det är en array med värden för de olika lägena för checkButton. värdena[0] är värdet när läget är PÅ, värden[1] är värdet när läget är AV,
values[2] is the value when the state is NEUTRAL. Värdearrayens längd är lika med värdet för lägesalternativet.
lägen
Antal tillstånd som tillåts.
Två för adaptiva formulär (På, Av) och tre för HTML5-formulär (På, Av, Neutral).
läge
Elementets aktuella läge.
Två för adaptiva formulär (På, Av) och tre för HTML5-formulär (På, Av, Neutral).
DateTimeEdit: (DateField) datetimeedit-datefield
dagar
Lokaliserat namn på dagar för det fältet.
månader
Lokaliserade månadsnamn för det fältet.
noll
Den lokaliserade texten för talet 0.
clearText
Den lokaliserade texten för rensningsknappen.