De indeling en positie van foutberichten in een adaptief formulier aanpassen

U kunt de indeling en de positie van de foutberichten in een adaptief formulier aanpassen. U kunt de volgende aanpassingen uitvoeren:

  • Locatie en lay-out van het bijschrift van een veld aanpassen zonder wijzigingen aan te brengen in de bijbehorende CSS-eigenschappen
  • Positie van inline foutberichten aanpassen
  • Inhoud van dynamische Help-indicator aanpassen
  • De positie van de veldcomponenten (bijschrift, widget, korte beschrijving, lange beschrijving en Help-indicatorcomponenten) aanpassen zonder wijzigingen aan te brengen in de bijbehorende CSS-eigenschappen

Lay-out van velden aanpassen

U kunt de indeling van één veld of van alle velden aanpassen om de positie van bijschrift en foutberichten te wijzigen. Voer de volgende stappen uit om een aangepaste indeling toe te passen op een veld:

Lay-out van één veld aanpassen

Voer de volgende stappen uit om een aangepaste indeling toe te passen op één veld:

  1. Open het formulier in de modus Stijl. Tik op canvas-drop-down > Style om het formulier in de stijlmodus te openen.

  2. Selecteer in het zijpaneel onder Formulierobjecten het veld en tik op de bewerkknop edit-button.

  3. Selecteer de status van het veld dat u wilt aanpassen en geef de opmaak voor die status op.

    Inline opmaak van een veld opgeven

De indeling van alle velden in een formulier aanpassen

Met AEM Forms kunt u nu een thema maken en dit toepassen op uw formulier. Met de Thema-editor kunt u op één plaats opmaak van formuliercomponenten opgeven. Wanneer u een thema maakt, geeft u de stijl op componentniveau op. Zie Thema's in AEM Forms voor meer informatie over thema's.

Maak een thema met de Thema-editor om de indeling van alle velden in het formulier aan te passen. Nadat u een thema hebt gemaakt, voert u de volgende stappen uit om het op een formulier toe te passen:

  1. Open het formulier in de bewerkingsmodus.
  2. Selecteer in de bewerkingsmodus een component en tik op veldniveau > Aangepaste formuliercontainer en tik vervolgens op cmppr.
  3. Selecteer in het zijpaneel onder Adaptief formulierthema het thema dat u hebt gemaakt met de Thema-editor.

Een aangepaste veldindeling maken

  1. CRXDE-lijst openen. De standaard-URL is https://[Server]:[Port]/crx/de.

  2. Kopieer een veldlay-out van het knooppunt /libs/fd/af/layouts/field (bijvoorbeeld defaultFieldLayout) naar het knooppunt /apps (bijvoorbeeld /apps/af-field-layout).

  3. Wijzig de naam van het gekopieerde knooppunt en het bestand defaultFieldLayout.jsp. Bijvoorbeeld errorOnRight.jsp.

  4. Waarde wijzigen van de eigenschappen qtip en jcr:description van het gekopieerde knooppunt. Wijzig bijvoorbeeld de waarde van de eigenschappen in Fout rechts

  5. Om nieuwe stijlen en gedrag toe te voegen, creeer een cliëntbibliotheek in de /etc knoop.

    Creëer bijvoorbeeld op de locatie /etc/af-field-layout-clientlib de client-library van het knooppunt. Voeg de eigenschap Categorieën toe met het bestand value.field.errorOnRight en style.less met de volgende code:

    .widgetErrorWrapper {

 height: 38px;
 margin: 5px;

 .guideFieldWidget{
 width: 60%;
 float: left;
 }

 .guideFieldError{
 overflow:hidden;
 width:40%;
 }

}

  6. Als u de weergave en het gedrag wilt verbeteren, neemt u de clientbibliotheek op die in het lay-outbestand is gemaakt (errorOnRight.jsp).

  7. Open het dialoogvenster Bewerken van het veld en selecteer het tabblad Stijlen. Selecteer in het vervolgkeuzemenu Veldlay-out configureren de nieuwe lay-out en klik op OK.

Het pakket ErrorOnRight.zip bevat code waarmee foutberichten aan de rechterkant van velden worden weergegeven.

Bestand ophalen

Op deze pagina