Switch
  • 22 Jul 2024
  • 7 Minutes to read
  • PDF

Switch

  • PDF

Article summary

The switch control offers users a simple yet powerful way to toggle between two states, providing intuitive control over binary options within forms. Whether rendered as "Active" and "Default" or "Yes" and "No," this versatile control enhances user experience by streamlining data entry and decision-making processes.

A quick glance at Switch Control on Form Designer for an Application Designer.

Upon configuring the Switch control, following figure is a view on Main Form for End User or Analyst.

Let's explore the following Use Case:

Use Case

User Persona: Application Designer

Solution

At NovaTech, In an expense tracking application, users often waste valuable time navigating through multiple screens or menus in search of "Completed" transactions and "Pending" transactions information. Without a clear and intuitive interface to distinguish between completed and pending transactions, leading to confusion, inefficiency.

To resolve this, Sam, the Application Designer incorporates a switch control into the expense tracking application, users to can toggle between viewing "Completed" transactions and "Pending" transactions. Thus the switch control enhances users' ability to manage their accounts effectively, enabling them to focus on pending transactions that require immediate attention.

Configure Switch

Configuring Switch comprises various settings such as Properties, Advance, Validations, Appearance, and Security. Along with information such as how it should render, like helpful information message and a tooltip on the usage of configured Switch.

To configure Switch control, perform the following steps:

  1. Navigate to Form Designer > Design Form > Controls.

  2. Expand Form Controls to locate the Switch control.

  3. Drag and drop Switch control on the design canvas. Hover over the added control to access the Settings and Delete icon.
    The Switch control is displayed:

    Figure: Switch

    Icon

    Description

    Settings icon will enable the Application Designer to configure the Switch Control in the Main Form.

    Delete icon will delete the Switch control from the Main Form.

    Controls for adjusting the size of Switch on Canvas.

  4.  Click Settings icon to configure the Switch control.
    On the Settings pop-up window, the following tabs can be configured.

Properties

Following are the 'General Properties' for the Switch control, followed by specific details about each field.

Figure: Switch - Properties

Field Description

This table contains the list of fields and their descriptions that are available under the Properties tab:

Field

Description

General

Title*

Enter an unique name for the Switch control. This name is identified in the configured Main Form.
Example: Major Incident, Terms and Conditions, etc.

Subtitle

Enter the text which you want to display just beneath the Title. You may use it to describe the purpose of the control or the way it should be used.

Render as*

Select from the drop-down to determine the behavior of the control. You can render the Switch as Active, Default and Switch.

Active

When the switch is in the "On" or "Active" position, it indicates that a certain setting, feature, or option is enabled or activated. Conversely, when the switch is in the "Off" or "Inactive" position, it indicates that the setting, feature, or option is disabled or deactivated.
Example: In the Incident module of the Service Management application, the Priority form allow administrators to customize the priority levels available for tasks within the module.
The added priority values can be made active of inactive by enabling the respective active switch.

Figure: Render as Active Switch

Notes

  • On a form we can only include One Active switch.

  • Only active values will be displayed for selection when referred to as Data Source in transaction forms.

Default

A Default Switch is a user interface control element that represents the default state of a setting, feature, or option, providing users with a clear indication of the initial configuration while still allowing them to make changes as needed. Example: In the Incident module of the Service Management application, in the Priority form, you have the option to mark a specific priority value as the Default. The Default Priority is the initial Priority level assigned to tasks when they are created, however the consumer can Switch to other value.

Figure: Render as Default Switch

Note

Only One Default Switch can be added.

Switch

Applicable in scenarios where users are required to make mutually exclusive decisions, such as choosing between 'Yes' or 'No' options, or selecting between 'Option 1' and 'Option 2'.

Figure: Render As Switch

Informative

Help Text

Provide a Help Text that gives the end users guidance on how to fulfill the purpose.

Example: Hotline Numbers, Bridge Details etc.

Upon providing details in the Help Text configuration, an information icon is displayed on the right side of the configured switch when used on the Main Form. When hovered upon the information icon, the Help Text information is displayed.

Figure: Help Text

Rich Text

Select it to enable the Help Text as a Rich Text format. It allows formatting like Bold, Italicized, Font Color to the text, etc. By default, Plain Text field is displayed. To convert this to a Rich Text Editor, enable the switch control for Rich Text.

Figure: Rich Text Editor

Tooltip

Add a Tooltip that is displayed when the user hovers the cursor over the Switch control.

Figure: Tooltip

Advance

Use switch in flexible ways on the Main Form  such as to include as Filter, as a column in grid view and to have it clickable, on the Advance properties of Switch Configuration.

Figure: Advance Properties

Field Description

This table contains the list of fields and their descriptions that are available under the Advance tab:

Field

Description

Include as Filter

Enable Include As a Filter for the Switch to be part of Filters option on the Form Designer list page of the Application.

Include as a column in grid view. 

Enable Include as a column in grid view for the Switch to be viewed as column in grid view. 

Is Clickable

Enable Is Clickable for the switch to render as Popover Form Action.

Validations

Validations ensure that the Switch meets specific criteria or requirements. Application Designer can add pre-built validations to save time and effort by ensuring accuracy and completeness without the need for custom rules. These offer a standardized method of Switch validation across forms, reducing errors and improving data reliability.

To configure Switch Validations, perform the following steps:

  1. Click Validations and select Tenant from the dropdown.
    Validation configuration is displayed.

    Figure: Switch Validation

  2.  Select the any of the following value for Validation.

    • Mandatory: Select Mandatory from the drop-down to make the control a mandatory control. It ensures that this field must be enabled before submitting the form. 

    • Disabled: Select Disabled from the drop-down to make the control as non-functional, it will be greyed out and user cannot act upon this control.

      Mandatory Validation

      Disabled Validation

  3. Upon selecting either Mandatory or Disabled, the following options to execute the validation is displayed.

    • Every Time: Select Every Time if you want to display this control always without any specific conditions.

    • Below Condition Meet: Select Below Condition Meet if you want the validations on the control to be triggered based on a specific condition(s).


    Multiple Validations can be added using Add icon or the existing validation can be deleted from using Delete icon.

    Field

    Description

    Click Add icon to include more Conditions. If multiple conditions are added then, it will by default consider 'AND' operator to execute the Validation.

    Click Delete icon to delete the condition from the configuration.

Appearance

This tab helps you to customize the Switch's appearance through appearance properties, enhancing user experience and reinforcing brand identity.

 Click Appearance on the configuration screen for the settings to be displayed.

Field Description

This table contains the list of fields and their descriptions that are available under the Appearance tab.

Refer to the following table for the field description: 

Field 

Description 

Font Type

Select the desired font from the drop-down menu to customize the Switch control. This field is auto-populated with a value named Default System Font which can be changed.

Font Color

Select a font color from the color palette to enhance the visibility and aesthetics of the Switch control.. The color configuration can be in the form of RGB / HSL or Hex Code.

Font Size

Select the desired font size to your preference for better readability and presentation for the Switch control. The value can be anywhere between 1 and 100.

Font Style

Select either Bold, underlined, or Italic font style to emphasize specific text in the Switch control.

Security

The Security tab ensures data security and privacy by applying restricted access or encryption to the Switch, ensuring that only users with authorized roles can access it.

Click Security on the configuration screen for the settings to be displayed.

Field Description

This table contains the list of fields and their descriptions that are available under the Security tab:

Refer to the following table for field description:

Field

Description

Restrict field access 

Enable this option to ensure that designated roles possess exclusive viewing or editing privileges for the content within the Switch control, thereby restricting access to authorized users only.

Example: In a financial management system, only designated financial analysts or managers should have access to view or edit sensitive financial data entered in Switch control. 

Encrypted

Enable this option to ensure sensitive information remains secure and confidential by making it unreadable without the appropriate decryption key.

Example: In a financial management system, sensitive information such as bank account details can be encrypted and only personnel with a decryption key can access the information.


Was this article helpful?

What's Next
Changing your password will log you out immediately. Use the new password to log back in.
First name must have atleast 2 characters. Numbers and special characters are not allowed.
Last name must have atleast 1 characters. Numbers and special characters are not allowed.
Enter a valid email
Enter a valid password
Your profile has been successfully updated.