Skip to main content

Celonis Product Documentation

Table
Introduction to Tables

Use the "Table" component on Views to give your users a quick overview of all relevant attributes. It supports a vast variety of configuration options.

table_overview.png

Overview

Placement

View or

Profile View

Required KM objects

Record Attribute,

KPI, or

Augmented Attribute

Related Content

Basic Configuration

To configure a basic table, you must have at least the following features defined. Ensure that prior to creating a new Table component you have all data you wish to include in the table properly defined in the Knowledge Model. Additional links on links on setting these fields up can be found in the table below.

Attribute

Required

Type

Description

field

true

Record Attribute,

KPI, or

Augmented Attribute

References objects defined in the Knowledge Model.

Important

In many use cases the record must have an identifier defined to use properly.

id

true

String

Defines a unique identifier for the field. It gets auto-generated if not defined. It is important in context of Base and Extension. To learn more about the concept check out the following documentation.

order

true

Integer

Defines the order of the table column. Gets auto-generated if not defined. It is important in context of Base and Extension. To learn more about the concept check out the following documentation.

Info

optimised for component editor

id: table-basic
type: table
settings:
  data:
     columns:
        - field: RECORD.ATTRIBUTE
                  id: 100
                  order: 100
        - field: KPI
                  id: 200
                  order: 200
Advanced Configuration

Since the table contains many different configuration options we will break this section down into:

Info

optimised for component editor

Click here to see YAML example

id: table-basic
type: table
settings:
  name: <String>
  options: #Options: General settings which apply to the entire table
         selectable: true 
         allowInvisibleColumns: true 
         showPagination: true 
         stickyHeader: true 
         stickyFirstColumn: true 
         stickyLastColumn: true  
     hideEmptyRows: true 
     allowDataExport: true 
     resizeMode: fit
     allowContentLineBreak:true
     allowHeaderLineBreak:true
  data:
     columns:
        - field: RECORD.ATTRIBUTE #Field: Column specific settings
                  id: 100
                  order: 100
                  onClick:
            openView: 
              profileView: true
              openInSideOverlay: false
              carrySelections: true
              carryFilters: true
              variables:
                - name: Task
                  value: 5 
            hrefAttribute: ACTIVITY.HREF_USERNAME
            openInNewTab: true 
                        update:
                variables:
                  - name: variable1
                  - name: variable2 
                  showAlerts: true
                  hide: true
                  copyToClipboard: true
                  displayContentRule: <String>
        - field: RECORD.ATTRIBUTE2
                  id: 200
                  order: 200
     limit: 50 #Others: General settings how to limit and sort the table
     distinct: true
     sortBy:
        - field: RECORD.ATTRIBUTE 
          direction: ASC
        - field: RECORD.ATTRIBUTE2 
          direction: DESC
"Options" configuration options

The options sections contains all general settings which apply to the entire table. Please find below an overview about the different configuration options:

Info

optimised for component editor

id: table-basic
type: table
settings:
  name: <String>
  options: #Options: General settings which apply to the entire table
         selectable: true 
         allowInvisibleColumns: true 
         showPagination: true 
         stickyHeader: true 
         stickyFirstColumn: true 
         stickyLastColumn: true  
     hideEmptyRows: true 
     allowDataExport: true 
     resizeMode: fit
     allowContentLineBreak:true
     allowHeaderLineBreak:true 
  data: 
     columns: #Basic configuration
        - field: RECORD.ATTRIBUTE 
                  id: 100
                  order: 100
        - field: RECORD.ATTRIBUTE2
                  id: 200
                  order: 200

Attribute

Required

Type

Possible values

Description

resizeMode

true

Boolean

fit

expand (default)

Defines how table columns should be spaced and behave as users resize them. The two options are:

  1. Expand to fit content (Expand): Columns will expand to show all column header and cell content using a horizontal scroll, if required. As columns are resized the table width will expand/condense based on adjusted columns.

  2. Fit to table width (Fit): Columns will be equally spaced to fit in defined table width. The table width will not change even as columns are resized.

Expand to fit content:

60365235.png

Fit to table width:

image2022-3-17_14-51-35.png

allowContentLineBreak

true

Boolean

true

false (default)

Defines if long text should appear in multiple lines in column cells.

image2022-3-17_14-54-37.png

allowHeaderLineBreak

true

Boolean

true

false (default)

Defines if long text should appear in multiple lines in column headers.

image2022-3-17_14-54-37.png

selectable

false

Boolean

true

false (default)

Defines that checkboxes are displayed in the first column. This is required for displaying default actions above the table.

55705663.png

allowInvisibleColumns

false

Boolean

true

false (default)

Defines that the user can configure the visible columns. The configuration is stored per user.

Important

When using this configuration also make use of the "name" attribute. Otherwise the layout won't look good.

55705664.png
55705665.png

showPagination

false

Boolean

true (default)

false

Defines if paginations at the bottom of the table should be displayed. Infinite scrolling will be used if pagination is not defined or set to "false".

55705668.png

stickyHeader

false

Boolean

true

false (default)

Defines if the header should be sticky while scrolling through the table.

55705671.gif

stickyFirstColumn

false

Boolean

true

false (default)

Defines if the first column should be sticky while scrolling horizontally through the table.

55705672.gif

stickyLastColumn

false

Boolean

true

false (default)

Defines if the last column should be sticky while scrolling horizontally through the table.

55705673.gif

hideEmptyRows

false

Boolean

true

false (default)

Defines if the empty rows should be hidden within the table. This is particularly useful if you have defined a fixed height in your layout and a large table limit e.g. 100 to display as many results as possible in the table. In case the table then just has non or just a view results it can avoid displaying an unnecessary scroll bar.

Info

This configuration might get replaced by lazy loading.

55705760.gif

allowDataExport

false

Boolean

true

false (default)

Defines end users can export the table as CSV or XLSX. Keep in mind that the download might take some time depending on how much data gets exported. The export button will be greyed out while the export is running.

Important

When using this configuration also make use of the "name" attribute. Otherwise the layout won't look good.

55705675.gif

density

false

Boolean

standard (default)

compact

relaxed

Defines if the table should be shown with a standard, relaxed, or compact view by changing the row height.

Standard

density_attr_standard.png

Compact

density_attr_compact.png

Relaxed

density_attr_relaxed.png
"Field" configuration options

The field sections contains all column specific settings. Please find below an overview about the different configuration options:

Info

optimised for component editor

id: table-basic
type: table
settings:
  data:
     columns:
        - field: RECORD.ATTRIBUTE #Field: Column specific settings
                  id: 100
                  order: 100
                  onClick:
            openView: 
              profileView: true
              openInSideOverlay: false
              carrySelections: true
              carryFilters: true
              variables:
                - name: Task
                  value: 5 
            hrefAttribute: ACTIVITY.HREF_USERNAME
            openInNewTab: true 
                        update:
                variables:
                  - name: variable1
                  - name: variable2      
          showAlerts: true
                  hide: false
                  copyToClipboard: true
                  displayContentRule: <String>
        - field: RECORD.ATTRIBUTE2
                  id: 200
                  order: 200

Attribute

Required

Type

Possible values

Description

onEdit

Defines if the column should enable inline editing.

Note

This feature is only currently available for augmented attributes

executeSkill

false

skillKey

-

Defines if a skill should be executed when any augmented attribute is updated in the table. You can create a skill and link to the column using the skillKey. For additional details on setting up an automation check out this document.

Important

When creating the skill for this configuration, you can use the inputs "NEW_VALUE" and "IDENTIFIER" if you wish to include these in your skill (E.g. Send email notification with updated value to customer)

Create a manual sensor with the following inputs:

NEW_VALUE

IDENTIFIER

59048106.gif
59048107.png

updateAugmentedAttribute

false

Boolean

true

false (default)

Defines if in-line editing should be enabled. Additional details on how to set this up can be found here.

Note

This can only be used for augmented attributes. Additional details on augmented attributes can be found here.

Click here to see screenshot:

data:
  columns:
...
...
   - field: PIZZA.TYPE
     id: df08a98d-812d-4008-ae80-583375530f0e
     order: 400
   - field: PIZZA.SIZE
     id: 3730ffb3-9e5b-40c2-85cc-f3d1c852e6d4
     order: 500
   - field: PIZZA.AUGMENTED_CATEGORY
     id: 8f04b729-cbbd-4185-8735-ada87bba5228
     order: 600
   - field: PIZZA.AUGMENTED_COMMENT
     id: c41d4c95-933d-47b3-81e7-256b2b1a50b9
     order: 700
     onEdit:
        updateAugmentedAttribute: true

onClick

Defines that the column should be displayed as link.

openView

Defines the view that will open onClick. You can link a Profile View (using the profileView selector) or any other view (using the viewKey)

profileView

false

Boolean

true

false (default)

Defines if a link to the record profile should be added. For more information, see Linking Tables to Profile Views.

55705699.gif

viewKey

false

view key

-

Defines the view the user wants to link to the table column using the View's Key.

showInSideOverlay

true

Boolean

true

false (default)

Defines if a modal gets opened or a slide in will appear.

Default Slide in (true)

Modal (false)

55705698.gif

hrefAttribute

false

Record.Attribute

-

References a KM record, which contains a URL. This can be used to generate dynamically URLs, which depend on the information from the individual table row.

55705702.gif

SET-UP STEPS

1.) Create a new Attribute, which contains the URL structure inside pql attribute

Knowledge Model

      - id: HREF_USERNAME
        displayName: Href Username
        pql: '''https://www.google.com/?q='' || "PizzaP2P-fixed_xlsx_Sheet_0"."USER_NAME"' 
        #Defines URL structure
        filterIds: []
        columnType: string

2.) Enable hrefAttribute for your table

View

- id: table
    type: table
    settings:
      data:
        columns:
          - field: ACTIVITY.CASEKEY
                        order: 100
            id: baffa132-b23a-4470-b2b6-36b069e6f893
            onClick:
              hrefAttribute: ACTIVITY.HREF_USERNAME #References attribute from KM
              openInNewTab: true 
              #Define if the URL should be opened in a new tab or not. Default: false

openInNewTab

false

Boolean

true

false (default)

Defines if the URL should be opened in a new tab or not. This configuration only works if you also use hrefAttribute.

55705702.gif

update

variable:

- name: variable1

- name: variable2

false

View Variable

Package runtime Variables

-

You can use a table to update a variable upon clicking a link in a row of your table. This allows you for example display the details of a specific line item right underneath the table component, instead of opening it in a separate profile view.Click here to learn more about the concept of variables here.

55705770.gif

View

variables:
  - name: demo #Defines demo variable.
    defaultValue: demo text
...
components:
  - id: table1
    type: table
    settings:
      data:
        columns:
          - order: 100
            field: ORDERS.ORDER_ID
            id: 893b4d4a-37e3-400a-af89-13692a9cf2f1
            onClick:
              linkToRecordProfile: true
            showTasks: true
          - order: 150
            field: ORDERS.CATEGORY
            id: 149e396e-37ad-4d6b-a877-74fafb14ba88
            onClick:
              update:
                variables:
                  - name: demo #Sets demo variable when the user clicks on the row. 
  - id: text
    type: task-list
    settings:
      name: ${demo.ORDER_ID} #Displays the ORDER_ID of the variable demo.

showAlerts

false

Boolean

true

false (default)

Defines that Alerts are displayed in the column. It can be used to inform a user about a potentials issue. For more details on how create alerts check out the following documentation.

55705742.png

hide

false

Boolean

true

false (default)

Defines if the column should be hidden or not. This configuration can be used in combination with allowInvisibleColumns: true (see above). By this columns are not visible by default but customers can still choose if they would like to have certain columns visible in their table.

55705729.gif

copyToClipboard

false

Boolean

true

false (default)

Defines to allow copy to clipboard functionality when hovering the cell in this column.

55705694.gif

displayContentRule

false

Custom Attribute

Defines custom formatting of individual attributes. You can change text formatting or apply icons based on different conditions. For more details check out the Display Rule documentation.

55705681.png
55705680.gif
"Other" configuration options

The others sections general settings how to limit and sort the table. Please find below an overview about the different configuration options:

Info

optimised for component editor

id: table-basic
type: table
settings:
  data:
     columns: #Basic configuration
        - field: RECORD.ATTRIBUTE 
                  id: 100
                  order: 100
        - field: RECORD.ATTRIBUTE2
                  id: 200
                  order: 200
     limit: 50 #Others: General settings how to limit and sort the table
     distinct: true
     sortBy:
        - field: RECORD.ATTRIBUTE 
          direction: ASC
        - field: RECORD.ATTRIBUTE2 
          direction: DESC

Attribute

Required

Type

Possible values

Description

limit

false

Integer

Defines how many rows should be displayed per page.

Click here to see screenshot

55705730.gif

distinct

false

Boolean

true

false (default)

Defines if only distinct values are displayed. It works only when options selectable, link, showTasks, showAlerts and task attributes are not enabled.

sortBy

- field: RECORD.ATTRIBUTE

false

Record.Attribute

-

Defines the default sorting of the table. It requires to define the field and which direction the table should be sorted. Multi-column sorting is possible.

Info

Sorting by KPI and Augmented Attributes is currently not supported.

Click here to see screenshot

55705731.png

direction: ASC

false

String

ASC

DESC

breakdownSelector:

columns:

-field

false

Record Attribute, KPI, Or Augmented Attribute

-

Defines if the user wil have a breakdown selector shown in their table. This breakdown selector will allow users to change the dimension that the data is aggregated by in the table.

breakdownSelector.png
id: table-d2d7e5fc-3251-48a4-a861-63aafaf86d76
type: table
settings:
  data:    
    breakdownSelector:  
        columns:    
        - field: ORDERS.CUSTOMER_ID     
        - field: ORDERS.CUSTOMER_NAME  
        columns:    
        - field: ORDERS.PRODUCT_NAME      
          id: 3e68b67d-b460-4ec9-9059-568fb808e03e      
          order: 100     
        - field: ORDERS.PROFIT      
          id: dade401a-25ea-485b-a3b4-11f5911e34f5       
          order: 200    
        - field: ORDERS.QUANTITY     
          id: b20417cd-8af3-431c-ae10-a75214960efd     
          order: 300 
 name: Customer Details