Form API Tag

The form API tag is used to display a form on a page. When the page is rendered the API tag will be replaced with the contents of that form's template and form fields.

If you are putting it in the rich text editor it's recommended to change the HTML block tag from a paragraph tag to a div.

Form Templates

It is strongly recommended that a shared form template is used instead of a template that is unique to the form. The default shared template for the form can be set when the form is added or edited. 

In the API tag, you can specify a specific shared form template by using the "template" parameter and the template key of the form template.

Learn more about APIs.

Minimum Tag

{{ _api.form.get.key('contact-form') }}

Example Tags

Display a form using an alternate form template

{{ _api.form.get.key('contact-form').template('template-key') }}

Display a form and set the default value for a field

Note that you can more easily set the default value for a field by filling in the "Default value" field when adding or editing the form field.

In this example the field's layout key is firstName.

{{ _api.form.get.key('contact-form').field({'firstName': {'value': 'Bob'}}) }}

Set the "data" value for a field

In this example we are setting the "data-test' attribute to "My Value".

{{ _api.form.get.key('contact-form').field({'fieldKey': {'data': {'test': 'My Value'}}}) }}

Set custom configuration on a field

In this example we are setting a custom configuration called "configKey". It can be accessed in the form template at:
form.fields.fieldKey.config.configKey

{{ _api.form.get.key('contact-form').field({'fieldKey': {'config': {'configKey': 'My configuration value'}}}) }}

API Tag Parameters

ParameterDescription
config This allows you to pass some custom configuration data to the form to use in the form template. You can then access the value under the form.config variable. For example:

{{ form.config.myConfigValue }}

Type: Array

Example:
config({'key1': 'Value 1', 'myConfigValue': 'Value Here'})
field This allows you to set the value of some of the form field tag attributes or field properties. For example, you could use it to set the default value for a form field.

It's structure is as follows:
field({FIELD_LAYOUT_KEY: {ATTRIBUTE_TO_SET: "VALUE"}}

The 'FIELD_LAYOUT_KEY' is the form field's layout key. It's shown when viewing the list of form fields.

The 'ATTRIBUTE_TO_SET' is the name of the form field attribute or property to set. Below is a list of all form field attributes or properties that you can set.

The 'VALUE' is the string or integer value to set for the form field attribute or property.

Here are the form field attributes or properties that you can set:


class - The 'class' attribute value for any form field HTML tag.
cols - The 'cols' attribute for a textarea HTML tag.
config - Custom configuration. Pass an array of values. The configuration will not be included in the field HTML.
data - The 'data' attribute. Pass an array of values.
description - The description property.
id - The 'id' attribute value for any form field HTML tag.
label - The label property.
rows - The 'rows' attribute for a textarea HTML tag.
value - The form field value.
style - The 'style' attribute for any form field HTML tag.
tabindex - The 'tabindex' attribute for any form field HTML tag.
title - The 'title' attribute for any form field HTML tag.

Type: Array

Example:
field({'firstName': {'value': 'Bob', 'label': 'Your First Name'}})
key Required

The form key.

This is necessary to display the form.

Type: String

Example:
key('contact-form')
template This specifies a specific shared form template to use. It is commonly used if you need to use an alternate form template instead of the default template for that form.

This is useful if you want to display the form in multiple areas of the site but the form is displayed differently in each section.

Type: String

Example:
template('template-key')