Docs for new default values and field names in the Form node (and Form Trigger ofc) (#3979)

Co-authored-by: Kartik Balasubramanian <22399046+HumanistSerif@users.noreply.github.com>
This commit is contained in:
David Arens
2025-12-04 18:32:15 +01:00
committed by GitHub
parent 344d481177
commit b931eb6c6f
2 changed files with 18 additions and 8 deletions

View File

@@ -63,14 +63,16 @@ When serving the form, you can pass values for hidden fields using [query parame
Use **Define Form** > **Using JSON** to define the fields of your form with a [JSON array of objects](/data/data-structure.md). Each object defines a single field by using a combination of these keys:
- `fieldLabel`: The label that appears above the input field.
- `fieldLabel`: The label that appears above the input field on the rendered form.
- `fieldName`: The field name that is used in the output of the Form node and to reference the field in expressions.
- `fieldType`: Choose from `checkbox`, `date`, `dropdown`, `email`, `file`, `hiddenField`, `html`, `number`, `password`, `radio`, `text`, or `textarea`.
- Use `date` to include a date picker in the form. Refer to [Date and time with Luxon](/code/cookbook/luxon.md) for more information on formatting dates.
- When using `dropdown`, set the choices with `fieldOptions` (reference the example below). By default, the dropdown is single-choice. To make it multiple-choice, set `multiselect` to `true`. As an alternative, you can use `checkbox` or `radio` together with `fieldOptions` too.
- When using `file`, set `multipleFiles` to `true` to allow users to select more than one file. To define the file types to allow, set `acceptFileTypes` to a string containing a comma-separated list of file extensions (reference the example below).
- Use `hiddenField` to add a hidden field to your form. Refer to [Including hidden fields](#including-hidden-fields) for more information.
- Use `html` to display custom HTML on your form. Refer to [Displaying custom HTML](#displaying-custom-html) for more information.
- `placeholder`: Specify placeholder data for the field. You can use this for every `fieldType` except `dropdown`, `date`, and `file`.
- `placeholder`: Specify placeholder data for the field. You can use this for every `fieldType` except `dropdown`, `checkbox`, `radio`, `date`, and `file`.
- `defaultValue`: Specify a value that will be pre-filled or pre-selected in the form element. You can use this for every `fieldType` except `password`, `html`, `hiddenField` and `file`.
- `requiredField`: Require users to complete this field on the form.
An example JSON that shows the general format required and the keys available:
@@ -78,7 +80,9 @@ An example JSON that shows the general format required and the keys available:
```javascript
// Use the "requiredField" key on any field to mark it as mandatory
// Use the "placeholder" key to specify placeholder data for all fields
// except 'dropdown', 'date' and 'file'
// except 'dropdown', 'checkbox', 'radio', 'date' and 'file'
// Use the "defaultValue" key to pre-fill a form field or pre-select a
// value in 'checkbox', 'radio' or 'dropdown' fields
[
{
@@ -100,6 +104,7 @@ An example JSON that shows the general format required and the keys available:
}
]
},
"defaultValue": "option 1",
"requiredField": true
},
{
@@ -120,7 +125,7 @@ An example JSON that shows the general format required and the keys available:
{
"fieldLabel": "Email",
"fieldType": "email",
"placeholder": "me@mail.con"
"placeholder": "me@mail.com"
},
{
"fieldLabel": "File",
@@ -142,7 +147,8 @@ An example JSON that shows the general format required and the keys available:
},
{
"fieldLabel": "Textarea",
"fieldType": "textarea"
"fieldType": "textarea",
"defaultValue": "Lorem ipsum."
},
{
"fieldType": "html",
@@ -161,7 +167,8 @@ An example JSON that shows the general format required and the keys available:
"option": "option 2"
}
]
}
},
"defaultValue": ["option 1", "option 2"]
},
{
"fieldLabel": "Radio",

View File

@@ -96,9 +96,10 @@ Create the question fields for your form. Select **Add Form Element** to add a n
Every field has the following settings:
- **Field Label**: Enter the label that appears above the input field.
- **Field Label**: Enter the label that appears above the input field on the rendered form.
- **Field Name**: This name is used in the output of the Form Trigger node. Use it to reference a form field in downstream nodes.
- **Element Type**: Choose from **Checkboxes**, **Custom HTML**, **Date**, **Dropdown**, **Email**, **File**, **Hidden Field**, **Number**, **Password**, **Radio Buttons**, **Text**, or **Textarea**.
- Select **Checkboxes** to include checkbox elements in the form. By default, there is no limit on how many checboxes a form user can select. You can set the limit by specifying a value for the **Limit Selection** option as **Exact Number**, **Range**, or **Unlimited**.
- Select **Checkboxes** to include checkbox elements in the form. By default, there is no limit on how many checkboxes a form user can select. You can set the limit by specifying a value for the **Limit Selection** option as **Exact Number**, **Range**, or **Unlimited**.
- Select **Custom HTML** to insert arbitrary HTML.
- You can include elements like links, images, video, and more. You can't include `<script>`, `<style>`, or `<input>` elements.
- By default, Custom HTML fields aren't included in the node output. To include the Custom HTML content in the output, fill out the associated **Element Name** field.
@@ -106,6 +107,8 @@ Every field has the following settings:
- Select **Dropdown List** > **Add Field Option** to add multiple options. By default, the dropdown is single-choice. To make it multiple-choice, turn on **Multiple Choice**.
- Select **Radio Buttons** to include radio button elements in the form.
- Select **Hidden Field** to include a form element without displaying it on the form. You can set a default value using the **Field Value** parameter or pass values for the field using [query parameters](#set-default-selections-with-query-parameters).
- **Placeholder**: Define a sample text to display inside compatible form elements. Placeholders are supported in **Email**, **Number**, **Password**, **Text** and **Textarea**.
- **Default value**: Define a default value that will be pre-filled or pre-selected in compatible form elements. Default values are supported in all form elements except **Custom HTML**, **File**, **Hidden Field**, and **Password**.
- **Required Field**: Turn on to require users to complete this field on the form.
### Respond When