Formulier met waarden uit externe registraties

In dit voorbeeld maken we een deel van een formulier bestaande uit één stap. De uitgangspunten zijn:

• de dummyjson-service bied een lijst van productcategorieën aan

• de service biedt ook een lijst van producten aan, per categorie

• na selectie van een categorie halen we de beschikbare producten uit die categorie op

De keuzelijsten voor categorieën en producten worden dus dynamisch opgebouwd op basis van data uit een externe service.

We gaan ervan uit dat u een formulier met geavanceerde logica kunt maken.

Service aanmaken

Note

Het kan zijn dat je onvoldoende rechten hebt om services aan te maken. Indien je deze rechten niet hebt, vraag dan aan een functioneel beheerder om de service in te stellen.

1. Navigeer in de beheeromgeving naar Configuratie > Services.

2. Klik op de Service toevoegen knop.

3. Vul de formuliervelden in:

   • Label: dummyJSON

   • OAS URL: https://tinyurl.com/dummyjson-oas

   • Type: ORC (Overige)

   • API root url: https://dummyjson.com/

   • Authorization type: No authorization

4. Klik op Opslaan.

Formulier maken

1. Maak een formulier aan met de volgende gegevens:

   • Naam: Productaanvraag

2. Klik op het tabblad Stappen en velden.

3. Klik aan de linkerkant op Stap toevoegen en selecteer Maak een nieuwe formulierdefinitie.

4. Onder de sectie (Herbruikbare) stapgegevens vul het volgende in:

   • Naam: Productkeuze

5. Sleep een Keuzelijst component op het witte vlak, vul de volgende gegevens in en druk daarna op Opslaan:

   • Label: Categorie

   • Scroll naar beneden en selecteer bij Keuzeopties variabele

   • Vul bij Opties-expressie het volgende in:

   {"var": "catagorieen"}
   

6. Sleep een Keuzelijst component op het witte vlak, vul de volgende gegevens in en druk daarna op Opslaan:

   • Label: Product

   • Scroll naar beneden en selecteer bij Keuzeopties variabele

   • Vul bij Opties-expressie het volgende in:

   {"var": "producten"}
   

7. Klik op de Variabelen tab in het formuliermenu en vervolgens op de Gebruikersvariabelen tab

8. Klik op Variabele toevoegen

9. Voer bij Naam Categorieën in en kies bij Datatype Lijst (array)

10. Klik op Variabele toevoegen

11. Voer bij Naam Producten in en kies bij Datatype Lijst (array)

12. Klik op de Logica tab in het formuliermenu

13. Klik op Regel toevoegen, gevolgd door Geavanceerd.

14. Vul bij Triggervoorwaarde deze JsonLogic in:

    {"!": [{"var": "categorieen"}]}
    

15. Klik op Actie Toevoegen en selecteer

    • dan haal de waarde op uit een externe registratie

    • Categorieën (categorieen)

    • Klik op Instellen

      • Vul bij Naam Haal categorieën op in

      • Selecteer bij HTTP-method GET

      • Selecteer bij Service dummyJSON

      • Vul bij Pad products/categories in

      • Selecteer bij Soort mappingexpressie jq

      • Vul bij Mappingexpressie sort in

    • Klik op Opslaan

    Note

    Omdat het antwoord van de dummyJSON service ongesorteerd is, gebruiken we de jq sort functie, zodat de opties in de keuzelijst op alfabetische volgorde komen.

    

    Deze actie betekent: als categorieen leeg is, bevraag dan de dummyJSON service voor products/categories, sorteer het antwoord en sla deze lijst van strings op in de variabele``categorieen``.

16. Klik op Regel toevoegen, gevolgd door Geavanceerd.

17. Vul bij Triggervoorwaarde deze JsonLogic in:

    {"!!": [{"var": "categorie"}]}
    

18. Klik op Actie Toevoegen en selecteer

    • dan haal de waarde op uit een externe registratie

    • Producten (producten)

    • Klik op Instellen

      • Vul bij Naam Haal producten in categorie op in

      • Selecteer bij HTTP-method GET

      • selecteer bij Service dummyJSON

      • Vul bij Pad products/category/{{ categorie }} in

      • Selecteer bij Soort mappingexpressie JsonLogic

      • Vul bij Mappingexpressie het volgende in:

      {"map": [
        {"var": "products"},
        {"merge": [ {"var": "id"}, {"var": "title"} ]}
      ]}
      

    • Klik op Opslaan

    Note

    

    Deze actie betekent: als er een categorie is gekozen, bevraag dan de dummyJSON service voor products/category/{{ categorie }} met de gekozen categorie in het pad, neem van elk product object in het products attribuut van het antwoord, de id en title en sla de resulterende lijst van lijsten van 2 strings op in de variabele``producten``.

19. Klik onderaan op Opslaan om het formulier volledig op te slaan.

U kunt nu het formulier bekijken.

Eventueel kunt u extra acties aan de regels toevoegen, zodat de Product keuzelijst alleen zichtbaar is wanneer er een categorie gekozen is:

Warning

Het bevragen van services kost tijd en kan de formulierlogica vertragen, omdat er op antwoorden gewacht moet worden. Probeer door handig gebruik van variabelen en triggers, deze bevragingen tot een minimum te beperken.

“Bevragen registraties” is geschikt voor gebruik, maar nog onvolledig. Bekende missende of beperkte functionaliteiten zijn onder andere:

• het “Probeer het uit” tabje

• export/import

• slimme caching

• en meer

Door de agile aard van de ontwikkeling staan deze issues op het moment niet op een roadmap.

Daarnaast kan de manier van invoegen van formulierdata in de bevragingen van syntax veranderen. Op dit moment kunt u met de bekende {{ variabelesleutel }} syntaxis, waarden invoegen in

• Pad

• waarden van Query-parameters (niet de sleutels)

• waarden van Request-headers (niet de sleutels)

• Body