Hoe kan ik het repeteer-element gebruiken?

  1. Wil je graag de gegevens uit je dynamische content verplaatsen?
  2. Wil je op een later moment in het formulier aanvullende informatie opgeven bij eerder opgegeven dynamische content?
  3. Of wil je de lay-out van de dynamische content in het document anders dan in je concept?

Het repeteer-element biedt hiervoor uitkomst en maakt het mogelijk om een dynamische content te kopiëren naar een andere plek in je formulier. Iedere keer als de gebruiker een gekoppelde dynamische content heeft toegevoegd, zal het repeteer element ook een blok toevoegen. Hierin kun je waardes terug laten komen uit je dynamische content met behulp van de scoped aliassen. Lees hier alles over via het artikel Hoe kan ik gegevens verplaatsen binnen een dynamische content?

Het element toevoegen

Via de Form Builder kun je het repeteer-element vinden onder 'Container'.

Element_toevoegen.png Zodra je het element hebt toegevoegd krijg je direct de mogelijkheid om het element te bewerken in de Form Builder. Onderstaande pop-up zal verschijnen in het beeldscherm.

Instellingen_-_Algemeen.png

Algemene instellingen

Label en Tekst

Met behulp van een label en tekst kun je een toelichting geven. Deze waarde zal getoond worden voor de gebruiker en in het document, mits anders opgegeven bij de overige instellingen.

Gekoppelde dynamische content element (alias)

Hier geef je de alias op van de dynamische content die je wilt koppelen aan het repeteer element. Per repeteer element kun je 1 dynamische content koppelen. Bekijk het artikel Gebruik aliassen om gegevens te koppelen om alles te leren over aliassen.

Seperator

Standaard worden er tussen de verschillende content blokken geen seperator weergegeven. Deze kun je instellen op een stippellijn, doorgetrokken lijn of een witruimte. Deze wordt dan standaard toegevoegd tussen de verschillende content blokken.

Weergave-instellingen

Via de tandwieltjes aan de linkerzijde kun je de 'Weergave-instellingen' tonen. Via het artikel Hoe kan ik de weergave van een element wijzigen? kun je hier alles over lezen.

Hoe werkt het?

Graag laten we je zien hoe het element werkt aan de hand van een voorbeeld. In het voorbeeld laten we de gebruiker met behulp van een dynamische content 'Aanwezigen' toevoegen. Deze aanwezigen kunnen via het repeteer-element allemaal ook een handtekening zetten. Handig voor rapportages waarbij je aan het begin van het formulier de gebruiker de verschillende personen wilt laten benoemen en je op het einde iedereen wilt laten tekenen.

Stap 1: Een nieuw concept starten

Een gebruiker ziet de dynamische content en kan een eerste aanwezige toevoegen.

Draft_-_DC_-_Stap_1.png

Stap 2: Een eerste aanwezige opgeven

De gebruiker geeft een naam op voor de eerste aanwezige.

Draft_-_DC_-_Stap_2.png

Stap 3: Het repeteer element volgt de dynamische content

Het repeteer-element herkent de dynamische content en voegt automatisch het eerste blok toe in een ander gedeelte van het formulier.

Draft_-_RP_-_Stap_2.png

Stap 4: Een tweede aanwezige toevoegen

De gebruiker drukt op de ' + Aanwezige' knop om een tweede aanwezige toe te voegen en geeft deze een naam.

Draft_-_DC_-_Stap_4.png

Stap 5: Het repeteer-element volgt automatisch

Bij het afronden kunnen beide aanwezigen tekenen in het formulier.

Draft_-_RP_-_Stap_4.png

Graag leggen we je uit hoe we dit hebben gebouwd. Hieronder kun je lezen wat we hebben gedaan.

Dynamische content

Als eerste moeten we hiervoor een werkende dynamische content toevoegen. In onderstaande afbeelding kun je zien hoe wij de dynamische content hebben ingericht in de Form Builder.

Dynamische_content.png

De stappen om bovenstaande te bouwen in de Form Builder

  1. Voeg een rij toe vanuit
  2. Plaats in de rij het container-element
  3. Voeg een rij toe binnen het container-element
  4. Plaats een titel-element in de rij met de tekst 'Aanwezigen'
  5. Druk op 'OK' om de pop-up te sluiten
  6. Gebruik de instellingen van de rij met de titel om deze een alternatieve achtergrond kleur te geven
  7. Voeg een rij toe onder de rij met de titel
  8. Plaats een dynamische content in de rij
  9. Geef aan dat er standaard 1 aan bij 'Aantal items bij aanmaken'
  10. Geef als 'Itemnaam' 'Aanwezige' op
  11. Ga naar de 'Weergave-instellingen' via de tandwieltjes en geef de alias 'aanwezigen' op
  12. Sluit het scherm door op 'OK' te drukken
  13. Voeg een rij toe in de dynamische content
  14. Plaats een tekstveld-element in de rij
  15. Geef bij 'Label' 'Naam' op
  16. Plaats bij placeholder 'Voor- en Achternaam'
  17. Ga naar de 'Weergave-instellingen' via de tandwieltjes en geef de alias 'naam' op
  18. Sluit het scherm door op 'OK' te drukken

Repeteer

Nu hebben we in een nieuwe sectie de handtekeningen gebouwd met behulp van een repeteer-element. Nadat je de gegevens hebt toegevoegd ziet deze er als volgt uit.

Repeteer_element.png

De stappen om bovenstaande te bouwen in de Form Builder

  1. Voeg een nieuwe rij toe
  2. Plaats een container-element in de rij
  3. Voeg een nieuwe rij toe in de container
  4. Plaats hierin op dezelfde manier een titel als bij de dynamische content en noem deze 'Handtekeningen'
  5. Voeg een nieuwe rij toe onder de rij met de titel
  6. Plaats hierin het repeteer-element
  7. Onder 'Gekoppelde dynamische content' plaats je de alias '@aanwezigen'
  8. Druk op 'OK' om de pop-up te sluiten
  9. Voeg een nieuwe rij toe in het repeteer-element
  10. Plaats een handtekening in de nieuwe rij
  11. Geef in de label de tekst 'Handtekening @.naam' op
  12. Druk op 'OK' om de pop-up te sluiten

Het is belangrijk om het punt-teken te gebruiken aangezien je gebruik maakt van een scoped alias. Hierdoor gaat de repeteer-element kijken naar enkel de opgegeven naam in de bijbehorende dynamische velden.

Tip: Je kunt zowel in de dynamische content als het repeteer-element alle beschikbare elementen terug laten komen. Zo kun je bijvoorbeeld foto's van bonnetjes in een declaratieformulier verplaatsen naar een bijlage.

Update: In de laatste update van Incontrol hebben wij de blauwe lijnen rondom het repeteer-element weg gehaald.