Grid
  • 20 Jul 2024
  • 10 Minutes to read
  • PDF

Grid

  • PDF

Article summary

While receiving a notification via Mail or MS Teams for any type of quantitative data we expect to view the data in a tabular format for better understanding. A Grid is a tabular view of records from the selected Table, these records can be of Single or Multi-record type based on the selected grid type from the General Characteristics. The display of these records can be designed either in a Horizontal or a Vertical view for the selected record type.

Record Types and their Implication on Grid

There are two types of Records available:


This Record Types must be selected from the Notification Designer page on the General stepper.

Single Record

The application designer require single record details as a Grid, then on the General stepper Record Type is selected as Single Record.

Figure: Single Record Type

Selecting Single Record will show the details of only one Record in the Grid View. Single Record will be represented based on the selected Grid Style, Vertical or Horizontal as displayed below:

Figure: Single Record Grid Preview

Multi Record

The application designer require multi record details as a Grid, then on the General stepper Record Type is selected as Multi Record.

Figure: Multi Record Type

Selecting Multi Record will show the detail of many Records in the Grid View. Multi Record will be represented based on the selected Grid Style, Vertical or Horizontal as displayed below:

Figure: Multi Record Grid Preview

Grid on the Action panel displayed on the left side of Template page. Grid element will have the option to add a new grid, and display existing Grids in the dropdown, which can be opened and edited.

Add Grid

To configure Grid on Email Notification Template, perform the following steps:

  1. Expand Grid and click +Add New.

    Figure: Add Grid

  2. A popup configuration window with the following properties sections are displayed.

General

This section displays the general properties of Grid which allows the Application Designer to configure a Grid with a unique name and style for the selected Table.

To configure the general properties, perform the following steps:

  1. Enter Grid Name. This name here will be how the Grid will be known by in the Template page.
    Example: Basic Incident Information, Solution Details, Caller Information, Incident Details etc.

    Figure: Add Grid

  2. Select Table from the dropdown.

    Note

    All the transaction Tables for the selected modules will reflect in the Table dropdown. Based on the selected Table the Configure Column section will be configured.

    Figure: Table

  3. Select Attribute Type, from the following options.

    • Single Value

    • Multi-Valued Group

    Figure: Attribute Type

    Single Value

    If Single Value is selected, then the Configure Columns section will not allow Multi-valued Group.

    Multi Valued Group

    This can be selected only for Vertical Grid Style and  Single Record on the General stepper. Upon enabling Multi-Value Group, a field named Group is displayed which contain Multi-Valued Groups for the Application Designer to select from the dropdown list.

    Note

    1. The Groups are populated based on the selected Table.

    2. The columns in the Configure Columns section belong to the selected multi-valued group in the Group dropdown.

    The following figure displays the Multi-valued Group functionality.

    Figure: Multi valued Group

    When previewed on the Designer, the following details are displayed.

    Figure: Preview

  4. Select Grid Style, this representation applies for both Single and Multi Records for the selected Table elements. By default Horizontal is selected.

    • Horizontal Grid: Is used to display left to right of records as Grid.

    • Vertical Grid: This is used for Top to bottom display of records as Grid.

    Figure: Grid Style

    Horizontal Grid

    Horizontal grid is represented using horizontal arrow iconon the action panel in Grids. The Application Designer will be representing records in a tabular format for the selected columns in left to right approach.


    Figure: Horizontal Grid Configuration

    Horizontal Grid for Single and Multi Record

    Selecting Record Type will affect the display of Horizontal Grid.

    If Single Record is selected and Horizontal Grid is selected then the following is displayed.

    Figure: Single Record Horizontal Grid

    If Multi Record is selected as Record Type and Horizontal Grid as Style then the display will be as below:

    Figure: Multi-Record Horizontal Grid

    Vertical Grid

    Vertical grid is represented using vertical arrow icon on the action panel in Grids. The Application Designer will be representing records in a tabular format for the selected columns in top to down approach.

    Figure: Vertical Grid Configuration

    Vertical Grid for Single and Multi Record

    Selecting Record Type will affect the display of Vertical Grid.

    If Single Record is selected and Vertical Grid is selected then the following is displayed.

    Figure: Single Record Vertical Grid

    If Multi Record is selected as Record Type and Horizontal Grid as Style then the display will be as below:

    Figure: Multi Record Vertical Grid

  5. Enable Active control for the Grid element to be available and in-use on the Notification Template.

    Note

    When a Grid that’s used in multiple templates is deactivated a message will be displayed as below:

    This Grid is used in multiple different Notification Templates. If Inactivated, the Grid will be hidden from all those templates which are currently Active.

Configure Columns

The Configure Columns section will have fields that replicate as columns in the Grid. Setting up of columns as a producer and representing them as grid includes configuring Fields, Alias Name, re-order, add and delete actions.

Figure: Configure Columns

  • Fields: This has two types of textboxes.

    • The first is the name of the Table, it’s auto-populated based on the selected Table. This is greyed and no action can be performed, it’s purpose is to only indicate the table name to which the Field belongs.

    • The second textbox functions with a dot walking mechanism, where the columns of the parent and related tables would load based on the dots placed by the Application Designer. For information, refer to Dot Walking.

  • Alias Name: This is a mandatory field by default, it will auto-populate with the Field name which is in-turn auto populated based on the selected Table. Let’s consider the following:

    Example: Field is SR_ID and Application Designer changes Alias Name to Ticket ID.

    In the Grid the column header will be Ticket ID instead of SR ID.

Icon

Description

 

Click add icon action will enable the Application Designer insert new Field Alias row for the selected Table.

Click delete icon action will remove the row from the Configure Column section.

 

Click re-order icon to re-arrange the Field elements across Configure Column section, to have the column order displayed on the Notification.

The following figure is the preview of Columns on the Email Notification.

Figure: Notification Email Preview

How the record should be displayed?

The configured Grid record can be directly displayed in the Email Body or or inserted as an attachment to the Email. This also provides an option to select the type of attachment by default being PDF.

Select Display Type from the following options.

  • Embed in Mail: Select this to display grid records on the Email Body.

    Note

    Maximum limit of records is 100, beyond that the records will be considered as an attachment.

    Figure: Embed in Mail

  • Consider as Attachment: Select this to add the record details as an attachment in the Email. Upon selecting, the Application Designer must select Type of Attachment. By default, PDF is selected and other options in the dropdown include PNG and Excel.

    Figure: Consider as Attachment

Appearance

Appearance of the Grid can be designed at a granular level that provide following options:

  • Copy Appearance

  • Grid Header

  • Grid Value

  • Grid Border

Figure: Grid Appearance

Appearance

Select Appearance from the dropdown which displays, previously created list of Grids.

Grid Header

The Application Designer can design the look of Grid Header, to have the view more appealing on the notification.

Figure: Grid Header Appearance

Field

Description

Text Size

Select the size of Grid header. The default value is 13, however, ranges from 1 to 100.
Example: The following figure displays the Grid Header size that is set at 24.

Figure: Grid Header Text Size

Text Color

Select text color of the Grid header, by default this is set to black. To change the color, click on color cube and choose the color. Input value can be any from RGB, HSL and HEX. The following Text Color selection is from producer view.

Figure: Text Color

The consumer will view the configured Grid Header text color is as displayed below:

Figure: Grid Header Text Color

Background Color

Select background color of the Grid Header. by default this is set to light blue. To change the color, click on color cube and choose the color. Input value can be any from RGB, HSL and HEX. The following Background Color selection is from producer view.

Figure: Background Color

The consumer will view the configured Grid Header background color as displayed below:

Figure: Preview of Header Background Color

Text Style

Select Text Style of the Grid header as any of Bold, Italic or Underline.

Text Alignment

Select Text Alignment from Left, Center, Right and Justified. However, Center will be default value.

Grid Value

The Application Designer can design the look of Grid Value, to have the view more appealing on the notification.

Figure: Grid Value Appearance

Field

Description

Text Size

Select the size of Grid value. The default value is 13, however, ranges from 1 to 100.
Example: The following figure displays the Grid Value size that is set at 24.

Figure: Grid Value Text Size

Text Color

Select text color of the Grid Value, by default this is set to black. To change the color, click on color cube and choose the color. Input value can be any from RGB, HSL and HEX. The following Text Color selection is from producer view.

Figure: Text Color

The consumer will view the configured Grid Value text color is as displayed below:

Figure: Grid Value Text Color

Background Color

Select background color of the Grid Value. by default this is set to light blue. To change the color, click on color cube and choose the color. Input value can be any from RGB, HSL and HEX. The following Background Color selection is from producer view.

Figure: Background Color

The consumer will view the configured Grid Value background color as displayed below:

Figure: Grid Value Background Color

Text Style

Select Text Style of the Grid header as any of Bold, Italic or Underline.

Text Alignment

Select Text Alignment from Left, Center, Right and Justified. However, Center will be default value.

Grid Border

Select Border Color by clicking color cube and selecting color any from RGB, HEX, or HSL.

Figure: Grid Border Color

Select Padding value from Top, Right, Bottom, Left.


Upon configuration of Grid, click Submit. Drag and drop the Grid element on the Email Body.

Figure: Notification Designer Details - Grid

Notes

  1. The sorting order for the grids will by default be the date and time of creation.

  2. The latest created Grid will be displayed first, and the oldest created Grid will be displayed last. The system will not follow the Alphabetical sorting order here.

  3. The system will not allow the grid to be a part of the email subject.

Unrelated Grids

When two Grids in the control panel belong to different tables, it is termed as Unrelated Grids.

A Notification template can have more than one Grid and all the Grids will be processed to display data related to the Notification triggering record. However, if tables that each Grid belongs to are not related to each other, the system cannot determine the data to be rendered in the email. To handle this, the user will be stopped from creating the notification template.

Consider the below example.

Grids “Basic SR Details” and “Caller Information” use the Manage Service Requests and Request employee profile update table respectively. However, if no such table level relation exists between the configured Grids, the Grids cannot be processed correctly.


When you click Next, a restricted use of multi-tables pop message is displayed as below:

Figure: Restricted Use

Time related components from Grid

All the Time related components from the record display Time zone name on the date-time field based on the record Created By. This apply to notifications generated by Workflow Designer, Business Rule Designer and Scheduler which uses email components from left panel in the designer such as Notification Elements (single chip that’s static elements), Grids (Horizontal and Vertical), Popover Form Elements, Approval Grids and Multi-Value group grid.

The following images display Time zone with Email components configured in the Template.

  • Date-time field with Time zone in a Grid.

    Figure: Email Notification

  • Time zone in Multi-valued group.

    Figure: Notification with Multi-Value Group Grid

  • Multi Record Grid.

    Figure: Multi-Record Group

Edit

To edit a Grid, perform the following steps:

  1. Click on vertical ellipsis and select Edit.

    Figure: Edit Grid

  2. The Grid configuration screen is displayed, make the required changes and click Update.

    Figure: Edit Basic Incident Information

To configure other email template elements, refer to the following:


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.