Simple Form Control Glossary

Updated on 09 Oct 2024
3 Minutes to read

Print
Share
Dark
Light

Article summary

Did you find this summary helpful?

Thank you for your feedback

Feature Details
Modified in Version	8.17
Modification Details	Simple Forms now supports Horizontal Stack.

The following list comprises the Controls and Layouts supported in Simple Forms and their available CSS classes for further customization.

Controls next to the gray column are child controls of the next above parent control. To access these child controls, change the control Control Type. This setting is further discussed in the following subsection.

Layouts

Name	Description	CSS Classes Available
Vertical Stack	Provide a layout where users can effortlessly drag and drop various other Form Controls to accommodate the controls side-by-side (horizontal) within the specified area.	CSS
Grid Layout	Fixed containers to house Form controls can be stacked upon each other as well as side-by-side.	CSS
Horizontal Stack	Provide a layout where users can effortlessly drag and drop various other Form Controls to accommodate the controls on top of each other (vertical) within the specified area.	CS

Controls

Action

Name		Description	CSS Classes Available
Button		Standard interactable button Available Display Type: Button, Link, and Image	Control
	Open URL	Opens the specified URL link once clicking the control	Same as parent
	Event	Triggers an event once clicking the control	Same as parent
	Previous	Reverses 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 loop.	Same as parent
	Post Back	Resets all entries in the Form	Same as parent
	Copy Text	Copies the text string value of the specified Textbox	Same as parent
	Data Repeater Add/Remove	Respectively adds or removes a row to its attached Data Repeater	Same as parent
	Sub Dialog	Runs a sub-dialog Flow that can house a Form to pop up in front of the current Form	Same as parent
	Data Grid Add/Remove	Respectively adds or removes a row to its attached Data Grid	Same as parent

Data

Name		Description	CSS Classes Available
Check Box		Create checkboxes for user selection	Label Control
	Switch	Displays a toggle button switch	Same as parent
Data Grid		Displays an Excel-like view of an Entity with the ability to have user action and edit the data source	Control
Data Repeater		Places 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
Document Viewer		Allows to view Documents	CSS
	Date	Allows the user to choose a date	Same as parent
	DateTime	Allows the user to choose a date and time	Same as parent
	Time	Allows the user to choose a time	Same as parent
	Calendar	Interactive Calendar where the end-user selects a date and/or time	Same as parent
Image		Displays an image	Label Control
Label		Displays non-interactive text	Label Label Holder
	Rich Text	Displays inputted text with options to change font format, style, color, size, alignment, copy, paste, insert image, create a table, hyperlinks, etc.	Same as parent
Latitude and Longitude		Displays the latitude and longitude of the specified location by working alongside the Geolocation API	Control
List		Displays text as a list; contains Single Select and Multi Select options for user selection.	Label Container Item Selected Item
	Sortable List Box	Displays text as a list where items can be rearranged and removed.	Label List Holder Sortable List Item Add Button
	Combo Box	Displays 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 List	Creates a list of checkboxes for user selection; contains only Multi Select behavior.	Same as parent
	Radio Button List	Creates a list with the ability for users to select via radio buttons; contains only Single Select behavior.	Same as parent
Progress Bar		Shows the progress of data being input and 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 Area		Displays 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 the designer to give the text a format value type: General, Number, Decimal, Currency, Email Address, SSN, Custom, Phone Number.	Same as parent
	Number Box	Only 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

Validation

Name	Description	CSS Classes Available
Validation Display	Shows validation messages for the Form	Control

File

Name	Description	CSS Classes Available
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 users to upload a file via drag-and-drop into the 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 users to upload multiple files via drag-and-drop into the area	Label Container FileName Link

Changing a Control's Control Type

The Control Type setting configures the appearance and functionality of a Simple Form control. 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.

For further information on Forms, visit the Decisions Forum.

Was this article helpful?

What's Next

Configuring Date Time Field

Table of contents

Layouts
Controls
Changing a Control's Control Type