Simple Form Control Glossary
  • 26 Jan 2022
  • 4 Minutes to read
  • Dark
    Light

Simple Form Control Glossary

  • Dark
    Light

Article Summary

Supported Controls and Layouts Glossary

The following list consists of the Controls and Layouts supported in Simple Forms as well as their available CSS classes for further customization. 

Controls appearing next to the gray column are child controls of the next above parent control. To access these child controls, change the control's Control Type (v7.9+) or Look and Feel (7.8-). These settings are discussed further in the following subsections.

Directory LocationNameDescriptionCSS Classes Available
Layouts

Vertical Stack

Preserve white space but hide components if necessary, can stack controls vertically
CSS

Grid Layout 

Fixed containers to house form controls, can be stacked upon each other
CSS
Controls > Action

Button

Standard interactable button
Available Display Type: Button, Link and Image
Control

Open URLOpens the specified URL link once clicking the controlSame as parent
EventTriggers an event once clicking the controlSame as parent

PreviousReverses Flow to previous steps; stops reversing when a Form with an Outcome Behavior Type Button is selected; when used in combination it can create a loopSame as parent

Post BackResets all entries in the FormSame as parent

Copy TextCopies the text string value of the specified TextboxSame as parent

Data Repeater Add/RemoveRespectively adds or removes a row to its attached Data RepeaterSame as parent

Sub DialogRuns a sub dialog Flow that can house a Form to pops up in front of the current FormSame as parent

Data Grid Add/RemoveRespectively adds or removes a row to its attached Data GridSame as parent


Controls > Data

Check Box

Create checkboxes for user selection
  • Label
  • Control

SwitchDisplays a toggle button switchSame as parent
Data Grid
Displays an Excel-like view of an Entity

Control

Data RepeaterPlaces a Simple Form within a Simple Form as a repeatable list of the same data type(s)
  • Control
  • Inner Margin
  • Outer Margin
  • Border Width
  • Corner Radius

Date Time Field

Allows the user to choose a date and time
  • Label
  • Button
  • Control

DateAllows the user to choose a dateSame as parent
DateTimeAllows the user to choose a date and timeSame as parent
TimeAllows the user to choose a timeSame as parent
CalendarInteractive Calendar where end user and select a date and/or timeSame as parent
ImageDisplays an image
  • Label
  • Control
LabelDisplays non-interactive text
  • Label
  • Label Holder

Rich TextDisplays inputted text with options to change font format, style, color, size, alignment, copy, paste, insert image, create a table, create hyperlinks, etcSame as parent
Latitude and LongitudeDisplays the latitude and longitude of the specified location by working alongside Geolocation APIControl

List 

Displays text as a list; contains Single Select and Multi Select options for user selection
  • Label
  • Container
  • Item
  • Selected Item

Combo BoxDisplays drop down list items of the specified Data Type with Single Select and Multi Select options for user selection
  • Label
  • Control
  • Button
  • Drop Down List
  • Selected Item

Check Box ListCreates a list of checkboxes for user selection; contains only Multi Select behaviorSame as parent

Radio Button ListCreates a list with the ability for users to make a selection via radio buttons; contains only Single Selectbehavior

Same as parent

Progress Bar

Shows the progress of data being input, allows the designer to set a minimum and maximum number for the bar
Control

Signature Pad

A signature can be drawn with a mouse or touch screen if applicable
  • Label
  • Control
Text AreaDisplays static or input data with a built-in label
  • Label
  • Control

Text Field

Users can input string
  • Label
  • Control
 AutoComplete Creates an auto-complete search bar

Same as parent

Currency Box
Number box that inputs and outputs currency

Same as parent

Masked Text Box
Allows designer to give the text a format value type: General, Number, Decimal, Currency, Email Address, SSN, Custom, Phone Number.

Same as parent

Number BoxOnly takes in and outputs a number

Same as parent

Number Spinner
Only takes in and outputs a number with up and down arrows for inputs

Same as parent

Password Text Box
Hides text with bullet points and allows the designer to create a minimum and maximum length

Same as parent

Text Box
Users can input string text

Same as parent

Video

Upload a video file or input a video URL to display on the Form
  • Label
  • Control
Controls > Data > Validation

Validation Display

Shows validation messages for the Form
Control
Controls > File

File Download

Allows download of one designated file
  • Label
  • Link
File Upload Allows upload of one user-specified file
  • Label
  • FileName
  • Button
  • Dialog Header
  • Dialog Body
  • Dialog Footer

File Upload Area

Allows user to upload a file via drag-and-drop into area
  • Label
  • Container
  • FileName
  • Link

Files Download

Allows download of multiple designated files
  • Label
  • FileName
  • Link

Files Upload

Allows upload of multiple user-specified files
  • Label
  • FileName
  • Button
  • Dialog Header
  • Dialog Body
  • Dialog Footer
Files Upload Area
Allows user to upload multiple files via drag-and-drop into area
  • Label
  • Container
  • FileName
  • Link



Changing a Control's Look and Feel

Note on version availability: Look and Feel appears in v7.8- instances.
If running a 7.9+ instance, please refer to the next subsection.

Configuring certain control's Look and Feel allows it to change into one of its child controls. To accomplish this, drag a parent control into the Simple Form's workspace. For this example, a Text Field is used. Notice how the Look and Feel Properties changes to the child control selection.



Changing a Control's Control Type

Note on version availability: Control Type appears in v7.9+ instances.
If running an earlier v7 Decisions instance, please refer to the prior subsection.

The Control Type setting configures the appearance and functionality of a Simple Form control. To accomplish this, drag a parent control into the Simple Form's workspace and click the Edit button under Control Type. The following example uses a Text Field that once changing the control also changes its Properties.



Note On Upgrading to 7.7+ Instances

The following changes affecting the below Simple Form controls occur in v7.7 instances.

Currency and Number Boxes

Currency and Number Boxes designed in 7.6- and then imported into a 7.7+ version Form may produce the following errors:

Error ResultPotential Issue(s)
Value as blank
  • User previously set Initial Value: a depreciated setting in 7.7+ instances
  • User previously set Allow Null a depreciated setting in 7.7+ instances
  • User previously set AutoPopulate 
Value as null

User previously set Outcome as optional

Validation errorUser previously set value as required

Number Spinners

Number Spinners designed in 7.6- instances and then imported into a 7.7+ version Form >may produce the following errors:

Error ResultPotential Issue(s)
Value as blankDefault issue due to Static Input, a new property in 7.7+ instances, being false upon upgrade
Value as nullUser previously set Outcome as optional
Validation errorUser previously set value as required
Flow does not completeUser previously provided data to value, which is blank by default upon upgrade, thus blocking the Flow's completion

Was this article helpful?