Form stage

A form stage includes a collection of data input fields. Users fill in the information and, upon submitting the form, proceed to the next stage.

This stage adds the fields key, which is a list of data input fields. Each field has the following attributes:

FieldName	Type	Required	Description	Default
id	string	X	Unique identifier of the input field
type	string	X	Field type, see the list of allowed types below
name	string	X	Field name
label	string/transObject	X	Field label, can be a string or a translation object
content	string/transObject		Text used to display a preamble for the field
required	boolean		Defines whether the field is required	false
pattern	string		Defines a regular expression used to validate the field

Field Types

The following field types are allowed:

• phone: A phone number field.
• email: An email field.
• text: A text field.
• selection: A selection field.
• date: A date field.
• gdpr: A GDPR field. Visually, it is a checkbox.
• memo: A memo field. Visually, it is a text field with multiple lines.

Example

{
    "id": "formContactDetails",
    "type": "Form",
    "fields": [
        {
            "type": "text",
            "required": true,
            "name": "firstName",
            "label": {
                "en": "First name",
                "es": "Nombre",
            },
            "pattern": "^[\\p{L} '.-]*$"
        },
        {
            "type": "text",
            "required": true,
            "name": "lastName",
            "label": {
                "en": "Last name",
                "es": "Apellido",
            },
            "pattern": "^[\\p{L} '.-]*$"
        },
        {
            "type": "phone",
            "required": true,
            "name": "phone",
            "label": {
                "en": "Phone",
                "es": "Teléfono",
            },
            "phonePrefix": "+34"
        },
        {
            "type": "email",
            "required": true,
            "name": "email",
            "label": {
                "en": "Email",
                "es": "Correo electrónico",
            }
        },
        {
          "type": "gdpr",
          "required": true,
          "name": "gdpr",
          "contentField": false,
          "text": {
            "en": "We respect your privacy. Before starting, read the privacy policy. Confirm that you have read the obligation information and accept the treatment of your data.",
            "es": "Respetamos tu privacidad. Antes de empezar, lee la política de protección de datos Confirma que has leido la  obligación informativa y aceptas el tratamiento de tus datos."
          },
          "items": []
        }
    ],
    "actions": [
        {
            "id": "1",
            "type": "forward",
            "title": {
                "en": "Continue",
                "es": "Continuar",
            },
            "priority": "primary",
            "nextNodeId": "dataConfirmation",
            "name": "continue"
        }
    ],
    "stageId": "2",
    "stepNumber": 3,
    "stepName": "contact-data"
},

In this stage, a key equal to the stage identifier is added to the context. Using the previous example, it would be formContactDetails. This object would contain the values of the form fields.

{
    ... # Other context data
    "formContactDetails": {
        "firstName": "Juan",
        "lastName": "Pérez",
        "phone": "+525555555555",
        "email": "[email protected]",
        "gdpr": true
    }
}