Switch form control

A form control that shows a selection of binary values, such as yes or no, or to turn an option on or off.


Toggle Switch form control

Configure the Switch form control

To configure the Switch Toggle Switch icon control, do the procedure in this topic.

Video: Common Configuration Settings in eForm Controls

Prerequisites

How to Start

  1. Open eForm Builder.

    For information about how to open this screen, refer to eForm Builder screen.


    Eform Builder screen
  2. On the eForm Builder screen, in the Tool Box, open the Commmon Controls tab.

    Common Controls tab
  3. On the Common Controls tab, drag a Switch Toggle Switch icon form control onto your eForm.

    Switch Form Control

General tab - Switch

Specifies the basic configuration for the Switch form control.

Figure: General tab

General tab

Fields

Field NameDefinition

Label
Description:
Specifies the text label that shows on your form for the control.
Allowed Values:
One line of text (a string).

Accepted:

  • Letters
  • Numbers
  • Spaces
Default Value:
Different for different controls.
Example:
This is a common configuration field that is used in many examples. Refer to:
  • Examples - Step-by-step use case examples, information about what types of examples are provided in the AgilePoint NX Product Documentation, and other resources where you can find more examples.

Internal Name
Description:
Specifies a unique, technical name for your control.
Allowed Values:
One line of text (a string).

Not Accepted:

  • Spaces
Default Value:
Different for different controls.
Example:
This is a common configuration field that is used in many examples. Refer to:
  • Examples - Step-by-step use case examples, information about what types of examples are provided in the AgilePoint NX Product Documentation, and other resources where you can find more examples.

Help Text
Description:
Specifies the text to shows when a runtime app user hovers their cursor over the form control.
Allowed Values:
More than one line of text.
Default Value:
None
Example:
Refer to:

Help Text Display
Description:
Specifies if the field shows the text in the Help Text field when the runtime app user hovers over the label or field.
Allowed Values:
  • None - Does not show the help text.
  • Hover On Label - Shows the help text when you put your mouse on the label.
  • Hover On Field - Shows the help text when you put your mouse on the field.
  • Hover On Both - Shows the help text when you put your mouse on the label and Field.
Default Value:
None
Example:
Refer to:

Configure tab - Switch

Configures the settings that are specific to the Switch form control.

Figure: Configure tab

Configure tab

Fields

Field NameDefinition

Required
Description:
Specifies if the field is mandatory.
Allowed Values:
  • Deselected - The field is not mandatory.
  • Selected - The field is mandatory.
Default Value:
Deselected
Example:
Refer to:

Validation Message for Required Field
Description:
Specifies the message to show if the form user does not enter data in a mandatory form control.
Allowed Values:
More than one line of text.
Default Value:
Enter the ${L}

${L} is a variable that shows the name of the form control.

Example:
Refer to:

Orientation
Description:
Specifies the direction the form shows your control.
Allowed Values:
  • Horizontal - The control shows horizontally.
  • Vertical - The control shows vertically.
Default Value:
Vertical
Example:
Refer to:

List Type
Description:
Specifies the data source to get the options in the list.
Allowed Values:
Default Value:
Inline List
Example:
Refer to:
Limitations:

The Picklist option is available in these releases:

Enable Sorting
Description:
Specifies whether to sort the options for the control in alphabatical order or ascending order.
Allowed Values:
  • Selected - Sorts the options for the control in alphabatical order or ascending order.
  • Deselected - Sorts the options for the control in any order.
Default Value:
Deselected
Limitations:

This field is available in these releases:

Name
Description:
Specifies the name of the option shown in the drop-down list.
To Open this Field:
  1. In the List Type field, select Inline List.
Allowed Values:
One line of text (a string).

Accepted:

  • Letters
  • Numbers
  • Spaces
Default Value:
None
Example:
Refer to:

Value
Description:
Specifies the value of the name option that shows in the list.
To Open this Field:
  1. In the List Type field, select Inline List.
Allowed Values:
One line of text (a string).

Accepted:

  • Letters
  • Numbers
  • Spaces
Default Value:
None
Example:
Refer to:

Choose a Default Option Choose a Default Option icon
Description:
Specifies the name option shown to the form user as default in the drop-down list.
To Open this Field:
  1. In the List Type field, select Inline List.
Allowed Values:
  • Selected - The selected option is the default list name.
  • Deselected - The option is not the default list name.
Default Value:
Deselected

Delete Delete icon

Function:
Deletes the selected row.
To Open this Field:
  1. In the List Type field, select Inline List.

Add Option

Function:
Adds more rows.

You can drag the rows to change the order.

To Open this Field:
  1. In the List Type field, select Inline List.

List Options Group From Manage Center
Description:
Specifies the user-defined values for your list.

You can configure a user-defined list in the Manage Predefined Lists screen.

To Open this Field:
  1. In the List Type field, select Predefined List.
Allowed Values:
  • A valid user-defined list
  • Locale
  • Languages
  • Time Zone
  • LCID
  • Countries
Default Value:
None
Example:
Refer to:

Picklist from Data Entities
Description:
Specifies the name of the picklist to shown in the drop-down list.
To Open this Field:
  1. In the List Type field, select Picklist (Data Entities).
Allowed Values:
A picklist from the list.
Default Value:
None
Example:
Refer to:
Limitations:

This field is available in these releases:

Lookup Source
Description:
Specifies a reusable lookup configuration. The lookup configuration includes the data source and other configuration values for the lookup.
To Open this Field:
  1. In the List Type field, select Lookup List.
Allowed Values:
A valid lookup source
Default Value:
None
Example:
Refer to:

Add Lookup Add Lookup icon
Function:
Opens the screen to configure a lookup.

There is more than one path to configure a lookup. Make sure you use the document that shows the path for your lookup.

To Open this Field:
  1. In the List Type field, select Lookup List.
Example:
Refer to:

Separator
Description:
Specifies the separators to separate multiple options.
Allowed Values:
  • Special characters
Default Value:
;

Appearance tab - Switch

Specifies the look and feel for the Switch form control.

Figure: Appearance tab

Appearance tab

Fields

Field NameDefinition

Font Family
Description:
Specifies the font family of the input text and label.
Allowed Values:
A font name from the list.
Default Value:
None
Example:
Refer to:

Font Size (px)
Description:
Specifies the size of the input text and label for your form control.
Allowed Values:
An integer.

Range

  • Greater than 0
Default Value:
None
Example:
Refer to:

Font Style
Description:
Specifies the style of the font for the input text and label.
Allowed Values:
  • Bold - Shows the input text and label in bold.
  • Underline - Shows the label underlined.
  • Italic - Shows the label in italic.
Default Value:
None
Example:
Refer to:

Foreground Color
Description:
Specifies the foreground color for your control.
Allowed Values:
A color value using a hex code, RGB code, or RGBA code.

You can enter a color code, or select a color from the palette.

Default Value:
#ff0000
Example:
Refer to:

Apply Font Properties To Control
Description:
Specifies if the control gets the font properties from the properties set in the form settings.
Allowed Values:
  • Selected - The control gets the font properties from the properties set in the form settings.
  • Deselected - The control does not get the font properties from the properties set in the form settings.
Default Value:
Deselected
Example:
Refer to:

Label CSS Class
Description:
Specifies a CSS class for the label of your control.
Allowed Values:
A valid CSS class.
Default Value:
None

If you specify your CSS CSS icon on the top menu, the CSS is populated.

Example:
Refer to:

Field CSS Class
Description:
Specifies a CSS class for the field in your control.
Allowed Values:
A valid CSS class.
Default Value:
None

If you specify your CSS CSS icon on the top menu, the CSS is populated.

Example:
Refer to:

Container CSS Class
Description:
Specifies a CSS class for the container of your control.
Allowed Values:
A valid CSS class.
Default Value:
None

If you specify your CSS CSS icon on the top menu, the CSS is populated.

Example:
Refer to:

Behavior tab - Switch

Specifies how the Switch control shows on the eForm.

Figure: Behavior tab

Behavior tab

Fields

Field NameDefinition

Enabled
Description:
Specifies if the form user can change the value of a field.
Allowed Values:
  • Selected - The form user can change the value.
  • Deselected - The input cannot change the value.
Default Value:
Selected
Example:
Refer to:

Right To Left
Description:
Specifies if the text for this control, including user input, shows from right to left.
Allowed Values:
  • Deselected - The text shows from left to right.
  • Selected - The text shows from right to left.
Default Value:
Deselected
Example:
Refer to:

Visible
Description:
Specifies if the runtime app user sees the field.
Allowed Values:
  • Selected - The runtime app user sees the field.
  • Deselected - The runtime app user does not see the field.
Default Value:
Selected
Example:
Refer to:

Label Position
Description:
Specifies the position of the text label that shows on your form for the control.
Allowed Values:
  • Inherit - The position of the label is as specified in the form settings.
  • Left - Specifies that the position of the label is to the left of the container.
  • Top - Specifies that the position of the label is to the top of the container.
Default Value:
Inherit
Example:
Refer to:

Advanced tab - Switch

Specifies the advanced settings for the Switch form control.

Figure: Advanced tab

Advanced tab

Fields

Field NameDefinition

Field ID
Description:
Shows an ID of the control.
Allowed Values:
Read only.
Default Value:
Different for different controls.
Example:
Refer to:

JavaScript Event
Description:
Specifies the JavaScript event that causes an effect.
Allowed Values:
  • None - No action.
  • Change - When a form user changes the content of an input field or selects a value.
Default Value:
None
Example:
Refer to:
Limitations:
These JavaScript events can not be used with this form control in AgilePoint NX OnDemand (public cloud) and AgilePoint NX PrivateCloud or AgilePoint NX OnPremises v8.0 because these events do not serve a function for this form control:
  • Blur
  • Click
  • Double Click
  • Focus
  • Keydown
  • Keypress
  • Keyup

JavaScript Function
Description:
Specifies the name of a JavaScript function to complete the activity.
Allowed Values:
The name of a Javascript function that exists in your app.

For more information, refer to (Example) Use Custom JavaScript in an eForm.

Default Value:
None
Example:

ConfirmSubmission where one of these is your function:

function ConfirmSubmission()
  {
    alert ('Are you sure to submit this form?');
    return true;
  }
function ConfirmSubmission(parameter1,parameter2)
  {
    window.alert ( parameter1 * parameter2);
    
  }

Also refer to:

Data Security Settings
Description:
Specifies whether to store information from the field in the process schema, so the app can use it again, or to simply pass on the information after the form is submitted without storing the information. This option helps to protect sensitive user information.
Allowed Values:
  • Persist - Stores the data from the field in the process schema, so the app can use it again.
  • Do Not Persist - Does not store the data from the field in the process schema. This option provides greater security for sensitive user information.
Default Value:
Persist
Example:
Refer to:

Show On Tablet Devices
Description:
Specifies if the form field shows on a tablet.
Allowed Values:
  • Selected - The form field shows on a tablet.
  • Deselected - The form field does not show on a tablet.
Default Value:
Selected
Example:
Refer to:

Show On Mobile Phone Devices
Description:
Specifies if the form field shows on a mobile device.
Allowed Values:
  • Selected - The form field shows on a mobile device.
  • Deselected - The form field does not show on a mobile device.
Default Value:
Selected
Example:
Refer to: