Using templates as a dynamic service

You can link a template to a service of type "HTML" to create a dynamic web page. This allows you to build interactive forms that display data and process user input.

Setup

1. Create a service of type HTML. The service can be linked to:

   • An GET template, which is rendered when a user opens the service in their browser.
   • A POST template, which is rendered when the user submits the form.

2. Create the templates referenced by the service.

3. Create a package, enable it, and add triggers linked to the service:

   • A Service GET trigger, which runs when the GET template is rendered. Use the script to prepare data for the form by assigning global variables.
   • A Service POST trigger, which runs when the user submits the form. The posted form data is available in source.body. Use the script to process the submitted data and assign global variables for the result template.

   To add a trigger, go to the package's Settings tab and add a trigger with the appropriate event type. The GET and POST triggers can be in the same package or in two separate packages.

Example: Dynamic form displaying posted data

This example shows a form that lets the user enter their name and displays a greeting after submission.

GET template (greeting-form, render mode None):

<h2>Greeting form</h2>
<form method="post">
  <label>Name: <input type="text" name="name" /></label>
  <button type="submit">Submit</button>
</form>

Result template (greeting-result, render mode Curly style):

<h2>Hello, {{$name}}!</h2>
<p>Thank you for submitting the form.</p>

Package script (with a Service POST trigger linked to the service):

const $name = source.body.name;

The input form does not need dynamic content, so no Service GET trigger is required. When the user submits the form, the Service POST trigger runs the script, which reads the posted name field from source.body and assigns it to the global variable $name. The result template then uses $name to display the greeting.