Skip to main content
Skip table of contents

Referentielijst gebruiken in formulierdefinitie

Vooraf

Vooraleer je deze stap uitvoert, moet er een referentielijst gedefinieerd zitten binnen de configuratiebestanden van je applicatie.

Referentielijst in formulierveld koppelen

  1. Ga in Studio naar je formulierdefinitie en vervolgens naar het tekstveld waar je de referentielijst wil koppelen.

  2. Open de geavanceerde eigenschappen van het tekstveld.

  3. Schakel de optie ‘Maak gebruik van referentielijsten’ in.

  4. Vul de relevante eigenschappen in. Zo moet je de key (naam) van de reflist ingeven, de veldwaarde invoeren (eigenschap van het object op basis waarvan je de gebruiker wil laten selecteren) en aangeven of je door de gebruiker zelf gedefinieerde waardes wil toelaten.

Referentie item aanroepen vanuit een computed expression

Eenmaal de referentielijst in een formulierveld is gekoppeld, is het mogelijk om vanuit een computed expression alle eigenschappen van het door de gebruiker geselecteerd referentie item aan te roepen. Deze computed expression kan je dan bijvoorbeeld gebruiken om andere formuliervelden automatisch mee in te vullen.

Voorbeeld

Stap 1: referentielijst opzetten

Een bibliotheek beschikt over een referentielijst books.reflist met alle uitleenbare boeken. Zie het voorbeeld op de pagina referentielijst opzetten.

Stap 2: referentielijst in formulierveld koppelen

De referentielijst koppel je in het veld $.bookToBorrow.

CODE
    {
      "name": "bookToBorrow",
      "label": "Which book would you like to borrow?",
      "type": "text",
      "referencelist": "books",
      "referencelistKey": "title",
      "binding": true
    },

De gebruiker kan nu op basis van de eigenschap title kiezen uit de books.reflist lijst.

image-20260323-084108.png

Merk op dat, hoewel je enkel de titel van het geselecteerde item ziet staan, achterliggend het volledige boek als object geselecteerd is.

CODE
  {
    "title": "Harry Potter and the Philosopher's Stone",
    "author": {
      "firstName": "J. K.",
      "lastName": " Rowling"
    },
    "originalLanguage": "English",
    "publishDate": "1997",
    "genre": "Fantasy",
    "nbOfPages": 223

Stap 2: computed expression opzetten

Vervolgens maak je een computed expression $$.author. Hierin maak je een concatenatie van de voornaam en achternaam van het de auteur van het in $.bookToBorrow geselecteerde boek.

$.bookToBorrow.author.firstName + ' ' + $.bookToBorrow.author.lastName

Voor ons geselecteerd boek geeft dit als uitkomst: J. K. Rowling.

Op dezelfde manier kan je ook aan alle andere eigenschappen van het geselecteerde boek.

CODE
"computedExpressions": {
    "author": "$.bookToBorrow.author.firstName + ' ' + $.bookToBorrow.author.lastName",
    "genre": "$.bookToBorrow.genre.replace(\" \",\"_\").toLowerCase()",
    "title": "$.bookToBorrow.title",
    "nbOfPages": "$.bookToBorrow.nbOfPages"
  }

Stap 3: computed expressions gebruiken

Tot slot kan je $$.author en de andere computed expressions gebruiken om andere formuliervelden automatisch mee in te vullen.

image-20260323-090109.png

JSON-definitie van deze automatisch ingevulde velden.

CODE
        {
          "name": "title",
          "label": "Title",
          "type": "text",
          "read-only": true,
          "computedWith": "title"
        },
        {
          "name": "author",
          "label": "Author",
          "type": "text",
          "read-only": true,
          "computedWith": "author"
        },
        {
          "name": "genre",
          "label": "Genre",
          "type": "choice",
          "read-only": true,
          "computedWith": "genre",
          "choices": [
            {
              "name": "historical_fiction",
              "label": "Historical fiction"
            },
            {
              "name": "novella",
              "label": "Novella"
            },
            {
              "name": "fantasy",
              "label": "Fantasy"
            },
            {
              "name": "mystery",
              "label": "Mystery"
            },
            {
              "name": "family_saga",
              "label": "Family saga"
            }
          ]
        },
        {
          "name": "numberOfPages",
          "label": "Number of pages",
          "type": "number",
          "read-only": true,
          "computedWith": "nbOfPages"
        }

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.