Form Builder

22 minute read Last updated on October 16, 2024

The Form Builder page provides users with a simple, drag-and-drop interface for creating custom forms that can be included in Dispatcher ScanTrip Cloud workflows and accessed at the MFP panel. Using a form at the MFP, you can enter identifying information about your scanned documents, choose processing and destination options, and more. Information associated with a form, such as default values and data entered by the user at the MFP, is available within the workflow as metadata, which can be used in a variety of ways.

Important! Since a single workflow can contain multiple forms, each metadata key must be unique. If there are two or more identical metadata keys, each will override the previous one; only the last value will be saved.

Accessing the Form Builder

To begin building forms, you must first access the Form Builder tool. Note that to access the Form Builder, you must be a tenant admin.

To access the Form Builder, do the following:

  1. Log into your Dispatcher ScanTrip Cloud account.

  2. From the Navigation pane, select Forms. The Form Management page appears:

    Form Management

  3. To create a new form, select Add New Form to open the Form Builder. To open an existing form, select the associated Edit icon in the Actions column.

    Note: To edit an existing form, it must be in an unpublished state.

The Form Builder page provides an intuitive, drag-and-drop interface for creating custom forms you can include in Dispatcher ScanTrip Cloud workflows and access at the MFP panel. Using a form at the MFP, you can enter identifying information about your scanned documents, choose processing and destination options, and more. Information associated with a form, such as default values and data entered by the user at the MFP, is available within the workflow as metadata, which can be used in a variety of ways.

Note: The Form Builder has a number of pre-built Sample Forms that can help make form creation easier.

Form Builder

The following sections provide detailed information about the Form Builder:

The following buttons appear on the Footer bar:

  • Cancel - Close the Form Builder, abandoning any pending changes.

  • Save - Save the form and continue editing.

  • Save and Close - Save your changes to the form, and close the Form Builder. The form will now be accessible on the Form Management page and in the Form Selector node (if it had previously been published).

This vertical bar appears on the far left of the page. It contains icons, including the following:

Validate

Validate

Select the Validate icon to check the form for logic errors, such as missing queries or improperly configured fields. A form must be successfully validated before it can be published on the Form Management page.

If the form passes validation, you will receive a notification. If the form does not pass validation, the issues will be described in the Error List that appears below the Form Builder Canvas.

Fields Panel

This panel appears on the left side of the screen and provides links to the Standard Index Fields. The list of fields available for Standard forms differs slightly from the list for Advanced forms. The Form Name field appears on the panel’s header bar. To edit the form name, select the Pen icon. To pin/unpin the panel, select the Pin icon Pin icon on the header bar.

The following illustration shows the Fields panel for an Advanced form called Holiday Questionnaire:

Fields Panel

Standard Index Fields

You can add the following fields to your form:

Icon Field Description
Text Line Text Line A text line field allows the user to input a single line of text about the scanned document(s), such as a document name or vendor name.
Text Area Text Area A text area field allows the user to input multiple lines of text about the scanned document(s), such as document names or vendor names.
Number Number A number field allows the user to input a number, such as an invoice number or user ID.
Checkmark Checkmark A checkmark box provides the user with a True/False option. For example, a user can choose whether or not to convert the document to Searchable PDF format.
Drop-down Drop-down A drop-down list allows the user to choose an item from a list.
Date and Time Date and Time A date and time field allows the user to associate the date and/or time with the scanned documents.
Hidden Hidden A hidden field can be used to store the results of other fields or default values that need to be associated with the document but do not need to be displayed to the user.
Label Label A label is static text to be displayed on the form.
Page Break Page Break A page break divides the form into different screens.

Working With Form Fields

For fields added to a form, you have the following options:

  • Identify a field - Hover over the icon in the upper-left corner to display the field type.

  • View variable name - Select a field to display the variable name associated with the field in the lower-right corner.

  • Rearrange forms - Select the six-dot icon on the left side of the field and drag to the desired location.

  • Duplicate a field - Select the Create a duplicate field icon in the upper-right corner of the field.

  • Delete a field - Select the Delete field icon in the upper-right corner of the field.

Standard form field options

Adding a Text Line Field

Text Line Field

To add a text line field to your form, drag and drop the Text Line icon to the Form Builder Canvas area. Select the newly created field to customize its properties in the Field Properties panel on the right. You can do the following:

  • In the Variable Name field, enter an internal, identifying name for the field that can be referenced by other nodes in the workflow or other fields on the form. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Friendly Name field, enter the text that will appear above the text field. The Friendly Name will always be visible to users who access the form.

  • In the Default Value field, specify default text that will appear in the field when the form first loads.

  • In the Min Length and Max Length fields, specify a minimum and maximum number of characters that can be entered.

  • In the Actions area, you can specify the following, based on which options you select:

    • Required - Set as a mandatory input field. Required fields are marked with an asterisk (*).

    • Read only - Set as a read only field that cannot be changed.

    • Mask input - Mask any text entered by the user.

    • Exclude from metadata - Do not include the variable as metadata associated with the document.

    • Add help text - Supply help information about the field. This help information will be accessed when the user taps a question mark icon next to the field. When this option is enabled, an “Edit help text” box will appear on which you can enter text.

When used in the Advanced Form Builder, you will also have access to many additional stylization options.

Adding a Text Area Field

Text Line Field

To add a text area field to your form, drag and drop the Text Area icon to the Form Builder Canvas area. Select the newly created field to customize its properties in the Field Properties panel on the right. You can do the following:

  • In the Variable Name field, enter an internal, identifying name for the field that can be referenced by other nodes in the workflow or other fields on the form. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Friendly Name field, enter the text that will appear above the text field. The Friendly Name will always be visible to users who access the form.

  • In the Default Value field, specify default text that will appear in the field when the form first loads.

  • In the Min Length and Max Length fields, specify a minimum and maximum number of characters that can be entered.

  • In the Actions area, you can specify the following, based on which options you select:

    • Required - Set as a mandatory input field. Required fields are marked with an asterisk (*).

    • Read only - Set as a read only field that cannot be changed.

    • Exclude from metadata - Do not include the variable as metadata associated with the document.

    • Add help text - Supply help information about the field. This help information will be accessed when the user taps a question mark icon next to the field. When this option is enabled, an “Edit help text” box will appear on which you can enter text.

When used in the Advanced Form Builder, you will also have access to many additional stylization options.

Adding a Number Field

Number Field

To add a number field to your form, drag and drop the Number icon to the Form Builder Canvas area. Select the newly created field to customize its properties in the Field Properties panel on the right. You can do the following:

  • In the Variable Name field, enter an internal, identifying name for the field. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Friendly Name field, enter the text that will appear above the number field. The Friendly Name will always be visible to users who access the form.

  • In the Default Value field, specify the value that will appear in the field when the form first loads. The field will be left blank if a default value is not given.

  • In the Min Value and Max Value fields, specify a minimum and maximum number of numbers that can be entered.

  • In the Actions area, you can specify the following, based on which options you select:

    • Required - Set as a mandatory input field. Required fields are marked with an asterisk (*).

    • Read only - Set as a read only field that cannot be changed.

    • Mask input - Mask any text entered by the user.

    • Exclude from metadata - Do not include the variable as metadata associated with the document.

    • Add help text - Supply help information about the field. This help information will be accessed when the user taps a question mark icon next to the field. When this option is enabled, an “Edit help text” box will appear on which you can enter text.

When used in the Advanced Form Builder, you will also have access to many additional stylization options.

Adding a Checkmark

Checkmark Panel

To add a checkmark box to your form, drag and drop the Checkmark icon to the Form Builder Canvas area. Select the newly created field to customize its properties in the Field Properties panel on the right. You can do the following:

  • In the Variable Name field, enter an internal, identifying name for the field that can be referenced by other nodes in the workflow. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Friendly Name field, enter the text that will appear above the checkmark options. If one is provided, the Friendly Name will be visible to the users on the form.

  • Customize the labels for the buttons that will appear in the True Button Label and False Button Label fields.

  • In the Actions area, you can specify the following, based on which options you select:

    • Check by Default - Set this option as automatically selected.

    • Read only - Set as read only buttons that cannot be changed.

    • Buttons List - Provides the field with buttons instead of checkboxes.

    • Exclude from metadata - Do not include the variable as metadata associated with the document. Metadata from this field cannot be accessed, even by typing in the metadata key manually.

    • Add help text - Supply help information about the field. This help information will be accessed when the user taps a question mark icon next to the field. When this option is enabled, an “Edit help text” box will appear below, in which you can enter text.

When used in the Advanced Form Builder, you will also have access to many additional stylization options.

Adding a Drop-down List

Drop-down Panel

To add a drop-down list to your form, drag and drop the Drop-down List icon to the Form Builder Canvas area. Select the newly created field to customize its properties in the Field Properties panel on the right. You can do the following:

  • In the Variable Name field, enter an internal, identifying name for the field that can be referenced by other nodes in the workflow or other fields on the form. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Friendly Name field, enter the text that will appear above the drop-down list. The Friendly Name will always be visible to users who access the form.

  • In the Drop-down list options area, enter the text and values that will appear in the drop-down list. For more information, see the Manually Adding List Items section below.

  • In the Actions area, you can specify the following, based on which options you select:

    • Required - Set as a mandatory field. Required fields are marked with an asterisk (*).

    • Read only - Set as a read only field that cannot be changed.

    • Multi select - Allow the user to choose more than one item from the list at a time.

    • Buttons list - Provides the field with buttons instead of checkboxes.

    • Exclude from metadata - Do not include the variable as metadata associated with the document.

    • Add help text - Supply help information about the field. This help information will be accessed when the user taps a question mark icon next to the field. When this option is enabled, an “Edit help text” box will appear on which you can enter text.

When used in the Advanced Form Builder, you will also have access to many additional stylization options.

Adding a Date and Time Field

Date and Time Panel

To add a field for the user to enter the date and/or time, drag and drop the Date and Time icon to the Form Builder Canvas area. This information will be associated with the file as metadata. Select the newly created field to customize its properties in the Field Properties panel on the right. You can do the following:

  • In the Variable Name field, enter an internal, identifying name for the field that can be referenced by other nodes in the workflow or other fields on the form. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Friendly Name field, enter the label you want to appear above the Date and Time field. The friendly name will always be visible to users who access the form.

  • From the Return Format drop-down list, choose the format to use.

  • In the Default Value field, choose or enter a default value for the field. You can click on the calendar icon to access a pop-up calendar or time clock as in the following illustration.

    List Values

  • If you check the Default to now box, the current date/time will be displayed.

  • If you would like to specify a specific date and time, enter it in the Add Date and Time field.

  • In the Default Range Min Value and Max Value fields, you can specify minimum and maximum values for the date or time, using the calendar icons to access calendar or time clock pop-ups. You will not be allowed to scan outside of the specified value range.

  • In the Actions area, you can specify the following, based on which options you select:

    • Required - Set as a mandatory field. Required fields are marked with an asterisk (*).

    • Read only - Set as a read only field that cannot be changed.

    • Exclude from metadata - Do not include the variable as metadata associated with the document.

    • Add help text - Supply help information about the field. This help information will be accessed when the user taps a question mark icon next to the field. When this option is enabled, an “Edit help text” box will appear on which you can enter text.

When used in the Advanced Form Builder, you will also have access to many additional stylization options.

Adding a Hidden Field

Hidden Field Panel

To add a hidden field to your form, drag and drop the Hidden icon to the Form Builder Canvas area. Hidden fields are used as temporary variables to store values that can be reused in the form. Select the newly created field to customize its properties in the Field Properties panel on the right. You can do the following:

  • In the Variable Name field, enter an internal, identifying name for the field that can be referenced by other nodes in the workflow or other fields on the form. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Default Value field, specify the value that will appear in the field when the form first loads.

  • In the Actions area, you can specify the following, based on which options you select:

    • Exclude from metadata - Do not include the variable as metadata associated with the document.

You will also have access to many additional stylization options.

Adding a Label

Label Field Panel

To add static text to the form, drag a Label icon onto your work area. Default text of “Label goes here” will appear. Select the newly created field to customize its properties in the Field Properties panel on the right. You can do the following:

  • In the Variable Name field, enter an internal, identifying name for the field that can be referenced by other nodes in the workflow or other fields on the form. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Friendly Name field, enter the label you want to appear in the Label field. The friendly name will always be visible to users who access the form.

You will also have access to many additional stylization options.

Adding a Page Break

Standard Forms Only

Page Break Properties Panel

To add a new page to the form, drag a Page Break icon onto your work area.

You can do the following to modify a Page Break:

  • In the Variable Name field, enter an internal, identifying name for the field that can be referenced by other nodes in the workflow or other fields on the form. The variable name will not be visible to users. Spaces are not allowed. All variable names in a form must be unique.

    This variable name can be referenced later by other nodes in the workflow or other fields using the following syntax: {form:[name of variable]} (e.g., if the variable name is ‘name,’ the variable name could be referenced in other nodes using this syntax {form:name}).

  • In the Page title field, enter the text that will appear at the top of the screen.

  • In the Actions area, you can specify the following, based on which options you select:

    • Hide back button - Do not display the icon to return to the previous page.

    • Hide next button - Do not display the icon to advance to the next page.

    • Hide scan button - Do not display the icon to scan files.

    • Hide home button - Do not display the home icon on this screen.

    • Hide return button - Do not display the icon that would return the user to the main menu.

    • Hide page numbers - Do not display the page number on this screen.

    • Add help text - Supply help information about the field. This help information will be accessed when the user taps a question mark icon next to the field. When this option is enabled, an “Edit help text” box will appear on which you can enter text.

Arranging Fields

When creating a Standard form, you may arrange form fields by dragging and dropping them into the canvas area, using the six dots icon on the left side of the field. Fields may only be positioned above or below previously-added fields.

Manually Adding List Items

When creating an Advanced form, list items can be added by clicking the edit list button Edit List Button in the Checkmark, Drop-Down, Button List, or Radio Button fields Properties Panels. This will open a window where you can add list options with user-facing names and associated metadata values.

List Items

Add as many options as you want by selecting the + button. Each list item has the following options:

  • Drag to reorder - Use the six dots icon to click and drag a list item to place it in a different position.
  • Show/Hide - Use the eye icon to show or hide the item from the list.
  • Select to set as default value - Select to have the option appear as selected by default in the form.
  • Label - The user-facing name associated with the list item.
  • Value - The metadata value associated with the list item.
  • Delete - Remove the list item.

Note: Options in this window may display differently depending on options selected in the Properties Panel. For example, when the Multi-Select option is selected, options in this window appear with checkboxes, which allow for multiple selections. When the Multi-Select option is not selected, options appear with radio buttons, which only allow for a single selection. This does not affect how the options are displayed when the form is accessed.

Form Builder Canvas

The Form Builder Canvas serves as a creative space where users can construct their forms visually, with drag-and-drop functionality for effortless customization. Standard Index Fields can be dragged and dropped onto the Canvas, where they will stay until moved.

Meanwhile, the Error List offers instant feedback, guiding users to rectify any validation issues promptly.

Form Builder Canvas

When building a Standard form, there are three buttons in the upper-right corner that are not clickable. These indicate the Home, Refresh, and Next Page buttons that typically appear on the MFP Panel.

Adding Fields or Tools to the Work Area

You can begin adding fields to your form by dragging-and-dropping the icons listed on the left hand side of the window into the Form Builder’s work area.

Duplicating Fields or Tools

Once in the work area, each index field includes a Duplicate button Duplicate icon above it. To duplicate an index field from your form, select that Create a duplicate field button.

Deleting Fields or Tools

Once in the work area, each index field includes a Delete button Delete iconabove it once it has been added to the canvas. To delete an index field from your form, select that Delete button.

Moving Fields or Tools Around the Work Area

You can rearrange the order of the index fields by dragging and dropping the fields on the work area. To move a field, do the following:

  1. Hover over the field you would like to move.

  2. Click the six dots in the upper-left corner.

  3. Drag the field to the desired position.

Configuring Fields or Tools

When you select a field on the Form Builder’s work area, the properties for the selected field appear on the right-hand side of the window. This is where you can configure the field to suit your purposes.

Error List

If you have attempted to Validate a form that is not configured correctly, the Error List area will appear in the middle of the screen, below the Canvas. The Error List contains additional information about each problem that is preventing the form from validating properly.

Field Properties Panel

Form Management

On the right-hand side of the screen, the Field Properties Panel displays the editable properties of the selected Standard Index Fields. This is where you can edit the field properties described in the Standard Index Fields and Tools sections above. This area can be pinned/unpinned by clicking the pin icon Pin icon in the upper-right hand corner.

Sample Forms

The Form Builder comes with several pre-configured forms that you can use in workflows or use as starting points to build more complex forms. Whether used directly or as inspiration for more complex designs, these samples enhance productivity and streamline workflows. Sample forms include:

  • Custom Email - This sample includes fields that allows users to enter information necessary to send the scanned document via email. The form contains the following fields:
  • Destination Selection - This sample allows users to select whether they would like documents saved to Dropbox, SharePoint Online, or OneDrive for Business. The form contains the following fields:
  • Email Drop-down - This sample allows users to select an email address they would like to email the scanned document to. The form contains the following fields: