Aangepaste weergaven maken in HTML5-formulieren

U kunt aangepaste widgets aansluiten op een mobiele Forms. U kunt bestaande jQuery-widgets uitbreiden of uw eigen aangepaste widgets ontwikkelen met het raamwerk voor weergaven. XFA-engine gebruikt verschillende widgets. Zie Vormgevingsframework voor adaptieve formulieren en HTML5-formulieren voor meer informatie.

Een voorbeeld van standaard- en aangepaste
widgetFigure: een voorbeeld van standaard- en aangepaste widget

Aangepaste widgets integreren met HTML5-formulieren

Een profiel maken 

U kunt een profiel maken of een bestaand profiel kiezen om een aangepaste widget toe te voegen. Zie Aangepast profiel maken voor meer informatie over het maken van profielen.

Een widget maken

HTML5-formulieren bieden een implementatie van het widgetframework dat kan worden uitgebreid om nieuwe widgets te maken. De implementatie is een jQuery-widget abstractWidget die kan worden uitgebreid om een nieuwe widget te schrijven. De nieuwe widget kan alleen functioneel worden gemaakt door de hieronder vermelde functies uit te breiden of te overschrijven.

Functie/klasse Beschrijving
renderen De renderfunctie retourneert het jQuery-object voor het standaard HTML-element van de widget. Het standaard-HTML-element moet van het brandpunttype zijn. Bijvoorbeeld <a>, <input> en <li>. Het geretourneerde element wordt gebruikt als $userControl. Als $userControl de bovengenoemde beperking specificeert, dan werken de functies van de klasse AbstractWidget zoals verwacht, anders vereisen sommige gemeenschappelijke APIs (nadruk, klik) veranderingen.
getEventMap Retourneert een kaart voor het converteren van HTML-gebeurtenissen naar XFA-gebeurtenissen.
{
vervagen: XFA_EXIT_EVENT,
}
In dit voorbeeld wordt getoond dat de vervaging een HTML-gebeurtenis is en dat XFA_EXIT_EVENT corresponderende XFA-gebeurtenis is.
getOptionsMap Retourneert een kaart die gedetailleerde informatie bevat over de handeling die moet worden uitgevoerd bij wijziging van een optie. De sleutels zijn de opties die aan widget worden verstrekt en de waarden zijn de functies die worden geroepen wanneer een verandering in die optie wordt ontdekt. De widget biedt handlers voor alle algemene opties (behalve value en displayValue)
getCommitValue Het widgetframework laadt de functie wanneer de waarde van de widget wordt opgeslagen in het XFAModel (bijvoorbeeld bij afsluitgebeurtenis van een textField). De implementatie moet de waarde retourneren die is opgeslagen in de widget. De handler krijgt de nieuwe waarde voor de optie.
showValue Standaard wordt in XFA bij Enter de rawValue van het veld weergegeven. Deze functie wordt aangeroepen om de rawValue aan de gebruiker te tonen.
showDisplayValue Standaard wordt in XFA bij afsluitgebeurtenis de formattedValue van het veld weergegeven. Deze functie wordt geroepen om formattedValue aan de gebruiker te tonen.

Als u uw eigen widget wilt maken, neemt u in het hierboven gemaakte profiel verwijzingen op van het JavaScript-bestand dat overschreven functies en nieuw toegevoegde functies bevat. De sliderNumericFieldWidget is bijvoorbeeld een widget voor numerieke velden. Als u de widget in uw profiel in de koptekstsectie wilt gebruiken, neemt u de volgende regel op:

window.formBridge.registerConfig("widgetConfig" , widgetConfigObject);

Aangepaste widget registreren met XFA Scripting Engine 

Wanneer de aangepaste widgetcode gereed is, registreert u de widget met de scriptengine met behulp van registerConfigAPI voor Form Bridge. Het neemt widgetConfigObject als input.

window.formBridge.registerConfig("widgetConfig",
        {
        ".<field-identifier>":"<name-of-the-widget>"
        }
    );

widgetConfigObject

De widgetconfiguratie wordt aangeboden als een JSON-object (een verzameling sleutelwaardeparen), waarbij de sleutel de velden identificeert en de waarde de widget vertegenwoordigt die met deze velden moet worden gebruikt. Een voorbeeldconfiguratie ziet er als volgt uit:

*{*

*“identifier1” : “customwidgetname”,
“identifier2” : “customwidgetname2”,
..
}*

waarbij "id" een jQuery CSS-kiezer is die een bepaald veld, een set velden van een bepaald type of alle velden vertegenwoordigt. In het volgende voorbeeld wordt de waarde van de id in verschillende gevallen weergegeven:

Type id Id Beschrijving
Specifiek veld met naam van veld Id:"div.fieldName" Alle velden met de naam 'veldnaam' worden weergegeven met de widget.
Alle velden van het type ‘type’ (waarbij het type NumericField, DateField enzovoort is).: Id: "div.type" Voor Tijdveld en DateTimeField is het type tekstveld omdat deze velden niet worden ondersteund.
Alle velden Id: "div.field"

Op deze pagina