Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

Version 1 Next »

JSON-code

Op pagina Formulier beheren kun je in WGP Beheer een tekstveld veranderen in een tekencanvas waarop je je handtekening kunt zetten. De (hand)tekening wordt als veldwaarde (base64-string) in de database vastgelegd. Je implementeert deze functie op tabblad Smart forms door in het options-gedeelte van de JSON-code voor het tekstveld het type 'signature' te gebruiken. Met optie 'btn_signature_title' kun je de knop waarmee je het tekencanvas opent een label geven. 

De code voor tekstveld 'code' ziet er bijvoorbeeld als volgt uit:

 Voorbeeldcode type 'signature'
{
  "schema": {
    "type": "object",
    "title": "Formulier ondertekenen",
    "properties": {
      "code": {
        "type": "string",
        "title": "Handtekening"
      }
    }
  },
  "options": {
    "fields": {
      "code": {
        "title": "Handtekening",
        "type": "signature",
        "styled": true,
        "signatureoptions": {
          "btn_signature_title": "Zet handtekening"
        }
      }
    }
  },
  "view": {
    "locale": "nl_BE"
  }
}


Gebruik in de app

De volgende afbeelding laat zien hoe het lege formulier met het handtekening-veld er in de WebGIS App uitziet:

Om een handtekening in te voeren volg je de volgende werkwijze:

  1. Tik je op de knop Zet handtekening. Hierna verschijnt te tekencanvas (met dezelfde naam). 

    De naam van de knop en het canvas kun je in de JSON-code opgeven met optie  'btn_signature_title' .

  2. Zet in het tekencanvas je handtekening en druk op Opslaan. De handtekening verschijnt in het formulier. 

  3. Druk in het formulier nog eens op Opslaan. Bekijk vervolgens het resultaat in de feature-info. 

    Je kunt de handtekening in de feature-info weergeven door in de template het element <img> op te nemen en daarin de veldnaam te specificeren.

    <table>
    <tr>
    <tt>handtekening</tt>
    <td><img src="$!code"/></td>
    </tr>
    </table>


Gerelateerde pagina's



  • No labels