eForm Builder screen

Lets you create or change an eForm.

Figure: eForm Builder screen

eForm Builder screen

Video: eForm Builder Interface

Video: Form Designer Overview

Examples

How to Start

  1. Do one of these:
  2. On the Application Explorer screen, do one of these:

Fields

Field Name Definition

Save Save icon

Function:
Saves your eForm.
To Open this Field:
Click Save Save icon.
Example:
Refer to:

Save and Check In Save and Check In icon

Function:
Commits your changes to the AgilePoint system.
To Open this Field:
Click Save Save icon.
Example:
Refer to:

Check Out Check Out icon

Function:
Locks the selected item so users cannot change it.
To Open this Field:
Click Save Save icon.
Example:
Refer to:

Undo Check Out Undo Check Out icon

Function:
Deletes all changes made to the application resource file since the last check in.

For more information, refer to What Data Is Deleted When I Delete an App or Application Resource?.

To Open this Field:
Click Save Save icon.
Example:
Refer to:

Print Preview Print Preview icon

Function:
Shows a print preview of the eForm.
To Open this Field:
Click Print Print icon.

Print Print icon

Function:
Lets you print the eForm.
To Open this Field:
Click Print Print icon.
Example:
Refer to:
Limitations:
These form controls are not supported for this feature because they display in IFrames:
  • List Box
  • Rich Text Box
  • Map
  • Chart

Save as PDF Save as PDF icon

Function:
Lets you save the eForm in PDF format.
To Open this Field:
Click Print Print icon.
Example:
Refer to:
Limitations:
These form controls are not supported for this feature because they display in IFrames:
  • List Box
  • Rich Text Box
  • Map
  • Chart

Cut Cut icon

Function:
Allows you to cut a form control from its original position.
Example:
Refer to:

Copy Copy icon

Function:
Copies the content from its original place and create a duplicate copy of the content at the desired location without deleting the text from the original location.
Example:
Refer to:

Paste Paste icon

Function:
Inserts the copied/cut data at the cursor's location.
Example:
Refer to:

Delete Delete icon

Function:
Deletes the selected item.
Example:
Refer to:

Undo Undo icon

Function:
Undo your last procedure.
Example:
Refer to:

Redo Redo icon

Function:
Cancels your last undo.
Example:
Refer to:

Settings Settings icon

Opens this Screen:
Form Settings
Function of this Screen:
Configures the settings for an eForm.
Example:
Refer to:

Sections Sections icon

Opens this Screen:
Form Section Settings
Function of this Screen:
Configures the form section and navigation bar settings for your eForm.
Example:
Refer to:

CSS CSS icon

Opens this Screen:
Form CSS screen
To Open this Field:
  1. On the eForm Builder screen, click CSS CSS icon.
Function of this Screen:
Lets you add custom CSS code to an eForm.
Example:
Refer to:

Shared CSS Shared CSS icon

Opens this Screen:
Shared Form CSS screen
To Open this Field:
  1. On the eForm Builder screen, click CSS CSS icon.
Function of this Screen:
Applies custom CSS code to all eForms in an application.
Example:
Refer to:

JavaScript JavaScript icon

Opens this Screen:
Form JavaScript screen
To Open this Field:
  1. On the eForm Builder screen, click JavaScript JavaScript icon.
Function of this Screen:
Lets you add JavaScript code to an eForm.
Example:
Refer to:

Shared JavaScript Shared JavaScript icon

Opens this Screen:
Shared Form JS screen
To Open this Field:
  1. On the eForm Builder screen, click JavaScript JavaScript icon.
Function of this Screen:
Specifies JavaScript code to use in all eForms in an application.
Example:
Refer to:

Columns Columns icon

Function:
Specifies a number of columns to show in your eForm.

For example, if you select 2, your eForm will have 2 columns.

Accepted Values:
An integer between 1 and 10.
Default Value:
3
Example:
Refer to:

Perspective View Perspective View icon

Function:
Shows how the eForm would look on different types of devices and screens in a new tab of your browser.
Accepted Values:
  • PC Browser PC Browser icon - Shows how the eForm would look on a desktop or laptop.
  • Tablet Landscape Tablet Landscape icon - Shows how the eForm would look on a tablet in landscape mode.
  • Tablet Portrait Tablet Portrait icon - Shows how the eForm would look on a tablet in portrait mode.
  • Phone Landscape Phone Landscape icon - Shows how the eForm would look on a mobile phone in landscape mode.
  • Phone Portrait Phone Portrait icon - Shows how the eForm would look on a mobile phone in portrait mode.
Default Value:
None
Example:
Refer to:

View Form JSON View Form JSON icon

Function:
Shows the eForm in JSON format.
To Open this Field:
  1. Click View JSON View JSON icon.
Example:
Refer to:

Import Form Import Form icon

Function:
Uploads an eForm in JSON format from your local file system.
To Open this Field:
  1. Click View JSON View JSON icon.
Example:
Refer to:

Export Form Export Form icon

Function:
Saves the eForm in JSON format.
To Open this Field:
  1. Click View JSON View JSON icon.
Example:
Refer to:

Library Library icon

Opens this Screen:
My Control Library screen
Function of this Screen:
Shows a list of form controls you have created on all of your eForms across all of your applications.
Example:
Refer to:

Form Data Form Data icon

Opens this Screen:
Form Data screen
Function of this Screen:
Shows a list of process data variables that you can use to configure your activity, instead of fixed values.
Example:
Refer to:

Rule Builder Rule Builder icon

Opens this Screen:
Rule Builder screen (eForm Configuration)
Function of this Screen:
Lets you configure rules that specify the behavior of your eForm and it's form controls.
Example:
Refer to:

Themes Themes icon

Function:
Lets you customize the theme for your eForm.
Example:
Refer to:

Translator Translator icon

Opens this Screen:
Translator screen
Function of this Screen:
Lets you configure translator to translate the language for your eForm and it's form controls.
Example:
Refer to:

Bulk Edit Bulk Edit icon

Opens this Screen:
Bulk Edit screen
Function of this Screen:
Lets you configure the properties of all form controls in your eForm at one time.
Example:
Refer to:

Row Scale Row Scale icon

Function:
Lets you customize the height of each row in your eForm.
Example:
Refer to: