Skip to content

Components JSON Schema

Randall Knutson edited this page Feb 21, 2018 · 19 revisions

Every component that can be rendered within a form also adheres to a JSON schema definition used to describe how that component behaves within the form. Every component that is rendered within a form shares a common schema that is used to represent the component as it is rendered within the form. Here are the common parameters that all components share.

Common Parameters

Property Description Value Required Default
type The type of component address yes address
key The API key for this field. any string yes
label The HTML label to give this component any string no
placeholder The text to show in the input before they type. any string no
input Determines if this is an input from the user. true or false yes true
tableView Determines if this field will show in the data tables output. true or false no true
multiple If this field should collect multiple values, creating an array of values. true or false no false
protected If the value of this field should be shown to the end user via API once it is saved. true or false no false
prefix The prefix text to put in front of the input Any string no
suffix The suffix text to put after the input Any string no
defaultValue The default value to provide to this component. Depends based on the component no
clearOnHide If the value of this field should be cleared when it is conditionally hidden. true or false no true
unique Validates if this field should be unique amongst other submissions in the same form. true or false no false
persistent Determines if the value of this field should be saved as persistent. true or false no true
hidden Determines if this field should be hidden from view by default. This can be overridden with the conditionals. true or false no false
validate Determines validation criteria for this component Object with the following properties.
  • required - If the field is required
  • minLength - For text input, this checks the minimum length of text for valid input
  • maxLength - For text inputs, this checks the maximum length of text for valid input
  • pattern - For text input, this checks the text agains a Regular expression pattern.
  • custom - A custom javascript based validation or a JSON object for using JSON Logic
no {required: false}
conditional Determines when this component should be added to the form for both processing and input. Object with the following properties.
  • show - If the field should show if the condition is true
  • when - The field API key that it should compare its value against to determine if the condition is triggered.
  • eq - The value that should be checked against the comparison component
  • json - The JSON Logic to determine if this component is conditionally available.
no
errors Allows customizable errors to be displayed for each component when an error occurs. This is an object with the following keys
  • required
  • min
  • max
  • minLength
  • maxLength
  • invalid_email
  • invalid_date
  • pattern
  • custom
An object where the keys are provided in previous cell, and the values are the strings you wish to display. Each string has the {{ field }} to use within the string. Example.
{"required": "{{ field }} is required. Try again."}
no
logic Allows changing the component definition in reaction to data entered in a form. For example, changing a field to required, disabled or hidden when a value is entered. An array of instances of the Field Logic Schema no

Below is a list of all Form Components and the JSON schema specification for each component. The following components are allowed.