Add Elements to a Form

Modified on Wed, 14 Jan at 10:20 PM

Home Page

Elements

TABLE OF CONTENTS

Form Elements
Adding an Element to a Form
Element Types
Additional Fields by Element Type
Auto-Populating Fields

The Form Builder allows you to create and manage the forms used throughout Screendragon, including forms for Projects, Workflows, Profile Forms, and Tasks.

Like all Admin Tools, the Form Builder is accessed via the cog icon in the top-right corner of the main screen. Selecting this icon opens the Admin Tools page in a new browser tab.

From the navigation panel on the left, choose Form Builder.

Once inside, you’ll see a list of all forms available in the system. Each form entry displays the form name, version number, version notes, and the user who last modified it, making it easy to track changes and manage updates.

Form Elements

Admin users can populate a form with data elements that end users must complete within the system. Elements define the type of information to be collected, how it is displayed, and what rules apply to input and validation.

Adding an Element to a Form

To add an element:

Navigate to the Admin Tools area.
Select the form you want to add the element to.
Click Add Element.
Complete the following standard details:

Label – The element label displayed to the end user.
Type – Select the element type. (See below for information on Element Types.)

Element Types

The table below outlines available element types. Additional configuration fields may appear depending on the type selected.

Field Type	Description
Text	Single-line text entry field.
Text Area	Multi-line text entry field.
Number	Input field with numeric validation.
Calculation	Performs calculations across multiple fields.
Date	Calendar picker for date selection.
Email	Input validated as an email address.
URL	Input validated as a web address.
Checkbox	Multi-select checkboxes.
Radio Button	Single-select radio options.
Drop Down	Single-select drop-down list.
Instruction	Form titles/instructions to guide users. Supports limited HTML tags: `<hr>` for a line, `<br>` for a line break.
File	Allows file upload. Extensions and size can be configured.
User	User dropdown in the application (can filter by groups).
Group	Dropdown of groups created in User Manager.
Linked Form	Link to another project’s form.
Linked Item	Pull values (e.g., Project Title, Start/End Date) from another form.
Form Code	Auto-generates an incremental project number.
Pattern (Expert use only)	Input must match a regular expression.
WYSIWYG Text Area	Rich-text entry with formatting.
Attribute Tree	Links to attribute trees configured in Attribute Manager.
Form ID	Displays Project ID (I_Node). View mode only.
Form Status	Displays Form Status. View mode only.
DB Text Validation	Validates input against an attribute list.
Colour Picker	Enables color selection.
Attribute Matrix	Links to a configured attribute matrix.
Matrix Input	Defines values based on prior selections.
Matrix Output	Outputs defined values, with configurable height.
Mirrored Field	Displays a read-only value copied from another field or source, keeping information in sync without allowing user edits.
Number	Captures numeric values for calculations, totals, or validation, with optional formatting and limits.
Pattern (expert users only)	Allows advanced users to define custom input validation using pattern-matching rules to enforce specific data formats.
Radio Button	Presents a set of options from which the user can select a value.
Reference Field	Links the form to an external object or record, allowing related data to be selected or displayed within the form.
Selections List	Displays a predefined list of options from which users can select one or more values, depending on configuration.
Text	Captures a single line of free-form text input.
Text Area	Provides a multi-line text field for longer responses or detailed input.
Unique Identifier	Automatically generates a system-defined, unique value to identify the form or record.
URL	Captures and validates a URL, ensuring it conforms to the valid URL format.
User	Allows selection of a system user, often used for ownership, assignment, or approval fields.
Workflow Version (displayed in view mode only)	Displays the current workflow version associated with the form for reference and auditing purposes.
WYSIWYG Text Area	Provides a rich-text editor that supports formatted content, including bold text, links, lists, and images.
Deliverable Cost (Output Only)	Displays the calculated cost associated with a deliverable. This value is system-generated and cannot be edited directly by users.
Deliverable Details (Hidden)	Stores internal deliverable information used for system logic, calculations, or workflow processing. This field is hidden from end users.
Deliverable Task Type	Defines the task type or category associated with a deliverable, driving workflow behavior, reporting, and resourcing logic.

Additional Fields by Element Type

File Upload

The File element allows users to upload one or more files directly into a form. It is commonly used when supporting documentation, evidence, or attachments need to be included with a submission.

Key Settings

Maximum File Size
Defines the largest file size that users are allowed to upload.
Allowed File Types
Specifies which file types can be uploaded. Enter file extensions as a comma-separated list (for example: jpg, png, pdf, docx).
Additional File Details
At the bottom of the element configuration, you’ll find options to control which upload details are displayed.

By default, all file details are shown, including:

File name
Upload date
Upload time
Uploaded by

You can toggle any of these settings individually if you prefer a cleaner or more streamlined view.

Text Area

The Text Area element works like a standard text field but provides a larger input space for users to enter longer responses, such as descriptions or comments.

Settings:

Set the default height or number of visible lines.
Apply standard text validation rules (required, max length, etc.).

WYSIWYG (What You See Is What You Get)

This field type allows users to format text directly within the form using a simple editor.

It’s ideal when you need structured or formatted input, such as a brief, proposal, or summary.

Features:

Supports bold, italics, underline, bullet, and numbered lists, hyperlinks, and alignment options.
Size options: Small, Medium, or Large.
The toolbar appears automatically to give users basic formatting controls.

Additional Details Based on File Type

Depending on the element chosen above, the following additional configuration may be available:

Allow Clones
When enabled, this option allows the form or record to be duplicated, creating a new copy that can be reused or modified without starting from scratch.
Monetary Display Controls how monetary values are displayed, including currency formatting, decimal precision, and symbol placement.
Date Display defines how date values are presented to users, including the format and level of detail.
Allow Filter When enabled, this option lets the field serve as a filter in views and lists, making it easier to search, sort, and refine results.
Columns (Checkbox/Radio) – Defines the number of columns displayed.
Show Non-Selected Values in View Mode
When enabled, this option displays all available values for the field in view mode, including those that were not selected. This allows users to view the full list of available options for reference and clearly indicates which values were selected.
Auto-Populating Fields
It is possible to auto-populate a form field with combined values from two or more other fields. This allows you to dynamically build text strings across multiple fields within the same form.

For Example: Add a Calculation field.

Wrap the calculation in double quotes ("") to ensure it is treated as a string, not a numeric expression.
Reference other fields or add text directly.

Option Source defines where the values in a drop-down field come from. Options can be sourced from a static list, another form field, system data, or an external source, keeping dropdowns consistent, dynamic, and reusable across forms. The choice determines whether other fields are required.
Options – Enter each option on its own line (one option per line). Do not include spaces or special characters in the skin name.
Other Option Label – Prompts users to add an “Other” option.
Auto Add Other Value – Automatically adds “Other” values to the attribute list.
Form Element / Variables (Calculation) – Define variables and equations for calculations.
Form, Search Data View (Linked Form) – Drop-down list of all other projects available to link to.
Form Field/Location/Behavior (Linked Item) – Select a field to link to from another form type.
Max File Size / Allowed File Extension (File) – Define upload rules.
User Group / Hide Current User (User) – Refine user selection.
Access / Group Tags / My Groups (Group) – Control group visibility and permissions.
Pattern Error Message – Custom error for invalid inputs.
Attribute Trees / Labels – Configure attribute tree display.
Element Height (Matrix Output) – If the element selected is Matrix Output AND the width is set to 100%, an option called ‘Element Height (for Matrix Outputs)’ will open to set the number of lines the output can appear over. By default, this is set to one, but can be up to five.

Next Step: Add additional fields to the element in the Form Builder.