Properties

Properties for Input control

The configuration is divided in four blocks, config, ui, schema & data where each block has its own tab below.

See the Example tabs for a full examples.

Control type: Input

Config

Name	Description	Default	Mandatory
required	Must have a value when leaving the step. true/false	false
readonly	Open to edit by enduser. true/false	false
type	Type of input value. Valid JSON types are: string, number, integer, boolean.	"string"

UI

Name	Description	Default	Mandatory
ui:size	The size of the component. Full size is 12.	12

Schema

Name	Description	Default	Mandatory
format	Validation of input data. Valid checks: strict, email, phone, postal. See below for more info.	N/A

Data

Name	Description	Default	Mandatory
data	Value to display from session or flow. {{{flow.attribute}}} {{{session.attribute}}}	N/A

Example 1

This is an example from a create step where values ​​are to be added. Mail and mobile have checks for correct syntax.

{
    "id": "sn",
    "type": "Input",
    "ui": {
        "ui:size": {
            "md": 6
        }
    },
    "schema": {
        "format": "strict"
    },
    "config": {
        "type": "string",
        "required": true
    }
},
{
    "id": "mail",
    "type": "Input",
    "ui": {
        "ui:size": {
            "md": 6
        }
    },
    "schema": {
        "format": "email"
    },
    "config": {
        "type": "string",
        "required": true
    }
},
{
    "id": "mobile",
    "type": "Input",
    "ui": {
        "ui:size": {
            "md": 6
        }
    },
    "schema": {
        "format": "phone"
    },
    "config": {
        "type": "string"
    }
}

Example 2

This is an example from a create step where values ​​are to be added from a session. In this scenario a user has logged in using Swedish BankID.

{
    "id": "givenName",
    "type": "Input",
    "ui": {
        "ui:size": {
            "md": 6
        }
    },
    "data": "{{{session.givenName}}}",
    "config": {
        "readonly": true
    }
}

Example 3

This is an example from a step where values ​​are to be added from a previous step or from a pipe in a previous step.

{
    "id": "<enter_unique_id_for_this_control>",
    "type": "Input",
    "data": "{{{flow.givenName}}}",
    "config": {
        "type": "string",
        "required": true
    }
}

Special notes for config.type and schema.format properties

The 'config.type' determines how the control is displayed in the view.

For the type 'string' the field can be validated before it is sent to the pipe or next step. The 'strict' validation is recommended as it blocks several common special characters not suitable for Pipe/Valve data handling. Postal is post address.