Table Features

Intro

The SAP Fiori elements templates support the features and settings for a table detailed below.

For design information see the table guidelines, starting with Table Overview, and the links within this article.

Feature Availability

Table Settings

Tooltips on Column Headers

On desktop applications, all table columns display tooltips, based on the text in:

• Common.QuickInfo, when it’s visible
• The column label, in all other cases

Tooltips are available only in desktop applications because users must hover their mouse on the column header to see them.

Clear All / Select All

When the selection of multiple rows is enabled for a table in the list report and object page, the Clear All :icon-clear-allcheckbox is displayed by default in the selection column header for all tables, but the responsive table. You can change the default.

Column Width

The default column width varies according to the column contents:

• Text: can range from 3 to 20 rem
• Image: 5 rem
• Rating or progress indicator: 6.875 rem
• Chart: 20 rem

You can change the width.

You can also ask the application developers to ensure the column width takes into account the contents of both the column and the column header.

Column Importance in Responsive Tables

By default:

• Key fields have high importance in list reports.
• Other columns have the importance of none and are handled like columns assigned medium importance.

You can change the level of importance.

The importance assigned to a column determines whether or not the table displays its values onscreen when screen space is limited:

• The values from high importance columns are always displayed onscreen — as columns or in the pop-in area, depending on the screen size.
• The values in columns with low importance are first to be hidden.

When at least one column is hidden, the table toolbar displays the Show Details button so users can view the previously hidden columns in the table pop-in area. After the user clicks Show Details to display the column, the action changes to Hide Details.

You can also assign an importance to custom columns.

For more information, see:

• Responsiveness
• Auto Popin Mode

Freezing Columns

You can freeze the first columns of an analytical table, grid table, or tree table so that they always remain visible when the users scroll the table horizontally. You specify the number of columns.

Labels for Multiple Fields in a Column

By default, with SAP Fiori elements for OData V4, when a column contains a field group with more than one field, the labels for those fields are not displayed.

You can enable the display of a label for each field. The field group label then is displayed as the column title in the header.

Sort Order

By default, the sort order for a column is ascending.

You can:

• Set the default sort order to descending.
• Define other, customized sort orders.

For more information, see the sort guidelines according to table type:

• Responsive Table
• Analytical Table
• Grid Table
• Tree Table

Quick Sort on a Column

Available for any sortable column.

When a column contains a combination of fields, such an ID and a description or a field group, the users can specify a sort and sort order for each field in the column with the quick sort.

Number of Table Rows Displayed at Once

Responsive Table

By default, a responsive table loads the following number of rows at once:

• 20 rows in a list report
• 10 rows in an object page with multiple sections
• 20 rows in an object page that includes one section and one subsection

When more rows exist, the users can click the More button at the end of the table to view additional rows.

With SAP Fiori elements for OData V2, you can change the default number.

Tree Table, Analytical Table, and Grid Table

By default, when the object page has the default anchor bar navigation or when an object page section contains controls besides the table:

• A tree table or an analytical table displays 10 rows
• A grid table displays 5 rows

When more rows exist, the users can scroll to display them.

With SAP Fiori elements for OData V4, the default number of rows can be changed.

Row Display on Scroll

To optimize the display of rows as the users scroll, the grid table, analytical table, and tree table preload a default of 300 table rows from the backend. The application developer can change the default number as required for the use case.

Grouping

Grouping is available in responsive and analytical tables.

You can define the format of the grouping headers.

For more information, see:

• Analytical Table: Group
• Responsive Table: Group

No Data Found Message

By default:

• An illustrated message with generic text is displayed with SAP Fiori elements for OData V4. You can add an action to the illustrated message or you can replace it with a text-only message.
• Generic placeholder text is displayed with SAP Fiori Elements for OData V2.

Generic Context Menu

For desktop and mobile applications, a generic context menu is activated and cannot be deactivated for all table types in the list report, object page, and analytical page.

The generic context menu generally behaves like the standard context menu described in the corresponding table articles, linked below.

The context of the generic context menu can be either a single row or multiple selected rows.

Single row context - a non-selected row is the "click target" so the context menu applies to the non-selected row

Multiple row context - one or more selected rows are the "click target " so the context menu applies to all the selected rows

Actions

The following actions are always available on the generic context menu:

• All toolbar actions that become active only after the selection of rows. Developers call them “bounded toolbar actions” or “context-dependent actions.”
• The “open in new tab or window” action. It allows up to 10 items to be opened in separate tabs or windows, depending on the user’s browser settings. As for the standard context menu, if a control inside a row is the “click target”, and that control also provides a context menu, the control context menu “wins”.
• Share to SAP Collaboration Manager when SAP Collaboration Manager is enabled. This item is displayed when the object page is in read only mode or in edit mode for read only columns.

For information on the standard context menu, see:

• Context Menu (Responsive Table)
• Context Menu (Grid Table)
• Context Menu (Analytical Table)
• Context Menu Tree Table

Tree Table Context Menu

With SAP Fiori elements for OData V4, the context menu for tree tables contains the actions from the generic context menu, and the actions specific to the tree table for example:

• A bounded Create action
• Move Up and Move Down for reordering nodes within the same hierarchical level
• Expand All and Collapse All
• Cut and Paste

Bounded Create

The bounded Create action is active in the context menu for a single container node or leaf node. The new item is created as a child of the selected node.

When multiple items are selected, it is inactive.

A “bounded action” is one that becomes active only after item selection.

Move Up, Move Down

The Move Up and Move Down actions are active in the context menu for a single container node or leaf node, and the action is relevant for the node.

When the action is not relevant, the menu displays it as inactive. For example, in the context menu for the last node in a container node, the Move Up action is active and the Move Down action is inactive.

The actions aren’t in the context menu when multiple items are selected.

Expand All, Collapse All

The Expand All and Collapse All actions are active in the context menu for a single container node, and the action is relevant to the node’s current state.

• Collapse All closes all the nodes it contains.
• Expand All displays all the nodes that the selected node contains down to the lowest level of leaf nodes.

The actions are in an inactive state in the context menu for a:

• Single leaf node
• Selection of more than one node
• Node that is already collapsed or expanded so the action is irrelevant

Paste

The paste action behaves differently, depending on the data structure in the backend table.

For a non-hierarchical data structure, when the users paste to a container node or leaf node at level n, the data is pasted as a child or children to the node at level n+1.

For a hierarchical data structure, when the users paste to:

• A container node at level n, the data is pasted as a child or children to the node at level n+1,
• A leaf node at level n, the leaf node becomes a container at the same level and the data is pasted as a child or children to the node at level n+1

Order of Nodes in the Tree Table

With SAP Fiori elements for OData V4, by default, a newly created node is always displayed first in the table or as the first child below its parent node, even when a sort or a filter is applied to the table. For example, a node created:

• At the root of the table is displayed first in the table
• In a container node is displayed first in the container node

Instead, you can enable an option to display new nodes in the order that they were created in the table or parent node. For example, a node created:

• At the root of the table is displayed as the last in the table
• In a container node is displayed last in the container node

This feature allows users to act directly on the table hierarchy — not just its display — when they:

• Create new table elements
• Reorder nodes from the generic context menu, by moving them up or down in the table or in their parent nodes

List Report and Analytical Page Only

Initial Expansion of Table Levels

By default, on initial load, the following expandable tables are expanded to this number of levels:

• Responsive table: 1 level
• Tree table: 1 level
• Analytical table: 0 levels

You can change the default value for the tree table and analytical tables.

Message Strip for Rows with Errors

When table rows contain errors, a message strip is displayed above the table. It contains a Filter Items link that lets users see only the rows with errors. After the users click the link, a Clear Filter link replaces it.

Object Page Only

Message Strip for Rows with Errors

When table rows contain errors, a message strip is displayed above the table. It contains a Filter Items link that lets users see only the rows with errors. After the users click the link, a Clear Filter link replaces it.

Related Links