The SAP Fiori elements templates support the features and settings for table rows or inline items detailed below.

For design information see the table guidelines, starting with Table Overview, and the links below.

Feature Availability

Actions

Empty Row for Data Entry in Create and Edit Modes

If users do not enter data in a new empty row, it is removed when the users save.

Drafts Saved for Rows

A draft for a once empty row is saved after the users:

• Shift the focus away from the input field in the row with SAP Fiori elements for OData V4
• Have shifted their focus away from the input field in the row and an interval of 20 seconds has passed with SAP Fiori elements for OData V2

User-Enabled Creation of Empty Rows in Edit Mode

In edit mode, you can turn off the default creation of empty rows for tables whose maintenance mostly requires updating data in existing rows.

If the users want to create additional rows, the Create button lets them enable the automatic creation of one empty row.

On first click, the Create button creates the empty row. On subsequent clicks, the Create button moves the focus to the first editable field in the first empty table row.  After the users save their changes, the automatic creation of empty rows is turned off.

Inline Actions

You can define actions for table rows or inline items. The action types can be:

• Actions that occur in the system while the user stays on the list report screen, for example Approve or Reject.
• Actions that navigate to a different application, for example, when the user can open a purchase requisition from a specific purchase order in the table.

When a page contains a grid table, an analytical table, or tree table that leads to object or subobject pages, users can navigate to the object or subject page at row level. The Show Detail button is not displayed in these tables. Instead, users can click the navigation indicator:   .

Direct Edit

You can enable this action to let users navigate from the table row to the corresponding object page in edit mode with the Edit icon  with SAP Fiori elements for OData V2.

This feature is available for responsive and grid tables. When it’s enabled, the object page footer displays the Save and Next  button.

For more information, see:

• Action Placement
• Terminology for Common Actions

Conditional Enablement of Navigation Buttons

In list reports and object pages:

• With SAP Fiori elements for OData V4, you can enable buttons that navigate the user to another page or application based on the value of a specific field.
• With SAP Fiori elements for OData V2, this feature requires extensions.

For example, you can enable the Generate Purchase Order button only for sales orders with the completed status.

Item Selection

Both versions of SAP Fiori elements allow you to determine whether users can select:

• One table row for a toolbar action, using a radio button.
• Multiple table rows for a toolbar action, using checkboxes.
  For an object page, you can enable selection of multiple rows for all the tables on the page, or for specific tables only.
  For an analytical table, grid table, or tree table, ask the development team to use the Multi-Selection Plugin.

When the selection of multiple rows is enabled for a table, both versions of SAP Fiori elements have the following defaults that you can change:

• Display of either the Select All or Clear All checkbox in the header of the selection column. The two versions differ in the way they do this.
  For complete information, see: Select All / Clear All.
• A limit of 200 rows that the user can select at once for grid tables, analytical tables and tree tables.
  You can change the limit. We recommend you consult the application team on how a change would impact performance.

SAP Fiori elements for OData V2

By default, single selection is enabled for a table. You can enable multiple item selection, known by application developers as multiselect.

SAP Fiori elements for OData V4

With the default auto mode, the application checks whether any table toolbar actions depend on item selection to be enabled. If not:

• In display mode, item selection is not possible.
• In edit mode, when the delete action is enabled, multiple selection is also enabled.

Instead, you can enable one of the following selection modes:

• None:
  • Display mode allows no item selection.
  • Edit mode allows multiple item selection when a Delete action is available in the table toolbar.
• Single: Both display and edit modes allow single item selection.
• Multi: Both display and edit modes allow multiple item selection.

For more information, see:

• Responsive Table: Select
• Analytical Table: Select
• Grid Table: Select
• Tree Table: Selection Modes

Delete

In responsive tables only, you can:

• Display an inline delete action.
• Prevent the deletion of certain rows.

In support of best design practices, SAP Fiori elements does not allow you to combine an inline delete action with a central delete action in the toolbar.

For more information, see Delete Single Item Rows.

Custom Actions

You can define custom inline actions.

Because custom inline actions are grouped, you cannot control their exact display order. However, you can control which columns display the groups.

Messages for Critical Actions

For actions that you set as critical, you can display one of the following after the user triggers the action:

• A message toast confirmation
• A confirmation message box to check the users want to proceed with specific critical actions

Also, the backend can require a confirmation on some actions. In this case, the confirmation message is always shown in a message box.

Example

For more information, see UI Text Guidelines for SAP Fiori Apps.

Display

You can include the display features described below in a table row or inline item.

Read-Only Field

With SAP Fiori elements for OData V4, you can set a field to display as read-only in a table, but set it as editable in another place on the UI.

Editing Status

By default, for draft-enabled applications, in a list report, the editing status is displayed:

• In the first column of a responsive table
• In a separate column, next to the key column, in a grid table. The column is unlabeled. Users can hide or display it by deselecting or selecting Edit Status in the table personalization dialog.

You can also add the semantic key to the status.

The edit status reflects the state of the object or item in the processing cycle. For example, it can give the user information about the state of completion for the item or whether it’s currently available.

• For Unsaved Changes and Locked statuses, a popover displays the full name or technical name of the user who last changed the object  when the name is available. “Another user” is displayed when it’s not.
• For Draft, Unsaved Changes and Locked statuses, a popover displays the user who last changed the item and the time of the change.

For more information, see Tables.

Rating Indicator

You can add an inline, read-only rating indicator and define a maximum rating of up to five stars. By default, five stars is the maximum.

The number of stars displayed depends on the value of a field in the backend. Decimal values are rounded up or down and when the value after the decimal point falls between x.25 and x.74, it is represented by a half star.

With extensions, you can enable editing of the rating indicator

For more information, see Rating Indicator.

Progress Indicator

You can:

• Enable an inline progress indicator to visually represent the level of completion of a project or goal, for example.
• Set the progress measure as a percentage or an absolute number, for example 3 or 8.
• Configure the progress bar to reflect the state of progress with color, based on the criticality of the progress.

For more information, see Progress Indicator.

Quick Contact View

You can add a quick view to a contact to display key contact details in a popover.

For applications with Microsoft Team integration, the contact quick view card displays options for starting an audio call, video call, or chat in with the contact in Microsoft Teams.

For more information, see Quickview.

Avatar and Other Images

You can display an avatar in the row and set a tooltip that displays when the focus is on the avatar.

For more information, see Avatar.

Highlighting Line Items

By default with SAP Fiori elements for OData V4, in draft-enabled applications, a newly created item in draft status is always highlighted in blue in grid and responsive tables.

Highlighting of new line items in draft-enabled applications is available with both SAP Fiori elements for OData V2 and V4.

You can also define highlighting and icons for line items based on their criticality.

After a newly created item is saved, it is highlighted according to the criticality, as follows:

• Green for success (criticality value 3)
• Yellow for warning (criticality value 2)
• Red for error (criticality value 1)
• No highlighting for no criticality (criticality value 0)

Responsive Table Only

In a responsive table, you can include the display features described below in a table row or inline item.

Multiple Fields in a Single Column

You can combine multiple IDs, descriptions, and action buttons in a single column in a responsive table.

For example, you can display the following in a single column:

• Company name
• Company ID
• Items in Stock
• Progress Indicator for Items in Stock
• Overall value of the Items
• Multiple Action buttons that allow the user to both:
  • Execute an action while staying on the list report page
  • Navigate to other objects and applications

The visibility and position in the table of a column that combines multiple fields can be changed.

Field Labels

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. Then, the field group label is displayed as the column title in the header.

Limitation on Export to Spreadsheet

When users export a table with a column that contains multiple fields to a spreadsheet, only the first piece of information displayed in the column is exported.

Related Links

The SAP Fiori elements templates support the features and settings for table rows or inline items detailed below.

For design information see the table guidelines, starting with Table Overview, and the links below.

Feature Availability

Actions

Empty Row for Data Entry in Create and Edit Modes

If users do not enter data in a new empty row, it is removed when the users save.

User-Enabled Creation of Empty Rows in Edit Mode

In edit mode, you can turn off the default creation of empty rows for tables whose maintenance mostly requires updating data in existing rows.

If the users want to create additional rows, the Create button lets them enable the automatic creation of one empty row.

On first click, the Create button creates the empty row. On subsequent clicks, the Create button moves the focus to the first editable field in the first empty table row.  After the users save their changes, the automatic creation of empty rows is turned off.

Mandatory Fields

In create and edit modes, both versions of SAP Fiori elements guide users in completing the required fields for an empty row, as follows:

• With SAP Fiori elements for OData V4, a red asterisk (*) is displayed in the column header label for the mandatory fields.
• Both SAP Fiori elements for OData V2 and V4 show an error message strip above the table:
  • When the table does not display mandatory columns. It instructs users to display the columns from the table settings.
  • When mandatory fields are not filled. In addition to the message strip for the table, the mandatory field displays a value state message. “Enter a value” is the the placeholder message text.

Drafts Saved for Rows

A draft for a once empty row is saved after the users:

• Shift the focus away from the input field in the row with SAP Fiori elements for OData V4
• Have shifted their focus away from the input field in the row and an interval of 20 seconds has passed with SAP Fiori elements for OData V2

Inline Actions

You can define actions for table rows or inline items. The action types can be:

• Actions that occur in the system while the user stays on the list report screen, for example Approve or Reject.
• Actions that navigate to a different application, for example, when the user can open a purchase requisition from a specific purchase order in the table.

When a page contains a grid table, an analytical table, or tree table that leads to object or subobject pages, users can navigate to the object or subject page at row level. The Show Detail button is not displayed in these tables. Instead, users can click the navigation indicator:   .

Direct Edit

You can enable this action to let users navigate from the table row to the corresponding object page in edit mode with the Edit icon  with SAP Fiori elements for OData V2.

This feature is available for responsive and grid tables. When it’s enabled, the object page footer displays the Save and Next  button.

For more information, see:

• Action Placement
• Terminology for Common Actions

Conditional Enablement of Navigation Buttons

In list reports and object pages:

• With SAP Fiori elements for OData V4, you can enable buttons that navigate the user to another page or application based on the value of a specific field.
• With SAP Fiori elements for OData V2, this feature requires extensions.

For example, you can enable the Generate Purchase Order button only for sales orders with the completed status.

Item Selection

Both versions of SAP Fiori elements allow you to determine whether users can select:

• One table row for a toolbar action, using a radio button.
• Multiple table rows for a toolbar action, using checkboxes.
  For an object page, you can enable selection of multiple rows for all the tables on the page, or for specific tables only.
  For an analytical table, grid table, or tree table, ask the development team to use the Multi-Selection Plugin.

When the selection of multiple rows is enabled for a table, both versions of SAP Fiori elements have the following defaults that you can change:

• Display of either the Select All or Clear All checkbox in the header of the selection column. The two versions differ in the way they do this.
  For complete information, see: Select All / Clear All.
• A limit of 200 rows that the user can select at once for grid tables, analytical tables and tree tables.
  You can change the limit. We recommend you consult the application team on how a change would impact performance.

SAP Fiori elements for OData V2

By default, single selection is enabled for a table. You can enable multiple item selection, known by application developers as multiselect.

SAP Fiori elements for OData V4

With the default auto mode, the application checks whether any table toolbar actions depend on item selection to be enabled. If not:

• In display mode, item selection is not possible.
• In edit mode, when the delete action is enabled, multiple selection is also enabled.

Instead, you can enable one of the following selection modes:

• None:
  • Display mode allows no item selection.
  • Edit mode allows multiple item selection when a Delete action is available in the table toolbar.
• Single: Both display and edit modes allow single item selection.
• Multi: Both display and edit modes allow multiple item selection.

For more information, see:

• Responsive Table: Select
• Analytical Table: Select
• Grid Table: Select
• Tree Table: Selection Modes

Delete

In responsive tables only, you can:

• Display an inline delete action.
• Prevent the deletion of certain rows.

In support of best design practices, SAP Fiori elements does not allow you to combine an inline delete action with a central delete action in the toolbar.

For more information, see Delete Single Item Rows.

Custom Actions

You can define custom inline actions.

Because custom inline actions are grouped, you cannot control their exact display order. However, you can control which columns display the groups.

Messages for Critical Actions

For actions that you set as critical, you can display one of the following after the user triggers the action:

• A message toast confirmation
• A confirmation message box to check the users want to proceed with specific critical actions

Also, the backend can require a confirmation on some actions. In this case, the confirmation message is always shown in a message box.

Example

For more information, see UI Text Guidelines for SAP Fiori Apps.

Display

You can include the display features described below in a table row or inline item.

Read-Only Field

With SAP Fiori elements for OData V4, you can set a field to display as read-only in a table, but set it as editable in another place on the UI.

Editing Status

By default, for draft-enabled applications, in a list report, the editing status is displayed:

• In the first column of a responsive table
• In a separate column, next to the key column, in a grid table. The column is unlabeled. Users can hide or display it by deselecting or selecting Edit Status in the table personalization dialog.

You can also add the semantic key to the status.

The edit status reflects the state of the object or item in the processing cycle. For example, it can give the user information about the state of completion for the item or whether it’s currently available.

• For Unsaved Changes and Locked statuses, a popover displays the full name or technical name of the user who last changed the object  when the name is available. “Another user” is displayed when it’s not.
• For Draft, Unsaved Changes and Locked statuses, a popover displays the user who last changed the item and the time of the change.

For more information, see Tables.

Rating Indicator

You can add an inline, read-only rating indicator and define a maximum rating of up to five stars. By default, five stars is the maximum.

The number of stars displayed depends on the value of a field in the backend. Decimal values are rounded up or down and when the value after the decimal point falls between x.25 and x.74, it is represented by a half star.

With extensions, you can enable editing of the rating indicator

For more information, see Rating Indicator.

Progress Indicator

You can:

• Enable an inline progress indicator to visually represent the level of completion of a project or goal, for example.
• Set the progress measure as a percentage or an absolute number, for example 3 or 8.
• Configure the progress bar to reflect the state of progress with color, based on the criticality of the progress.

For more information, see Progress Indicator.

Quick Contact View

You can add a quick view to a contact to display key contact details in a popover.

For applications with Microsoft Team integration, the contact quick view card displays options for starting an audio call, video call, or chat in with the contact in Microsoft Teams.

For more information, see Quickview.

Avatar and Other Images

You can display an avatar in the row and set a tooltip that displays when the focus is on the avatar.

For more information, see Avatar.

Highlighting Line Items

By default with SAP Fiori elements for OData V4, in draft-enabled applications, a newly created item in draft status is always highlighted in blue in grid and responsive tables.

Highlighting of new line items in draft-enabled applications is available with both SAP Fiori elements for OData V2 and V4.

You can also define highlighting and icons for line items based on their criticality.

After a newly created item is saved, it is highlighted according to the criticality, as follows:

• Green for success (criticality value 3)
• Yellow for warning (criticality value 2)
• Red for error (criticality value 1)
• No highlighting for no criticality (criticality value 0)

Responsive Table Only

In a responsive table, you can include the display features described below in a table row or inline item.

Multiple Fields in a Single Column

You can combine multiple IDs, descriptions, and action buttons in a single column in a responsive table.

For example, you can display the following in a single column:

• Company name
• Company ID
• Items in Stock
• Progress Indicator for Items in Stock
• Overall value of the Items
• Multiple Action buttons that allow the user to both:
  • Execute an action while staying on the list report page
  • Navigate to other objects and applications

The visibility and position in the table of a column that combines multiple fields can be changed.

Field Labels

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. Then, the field group label is displayed as the column title in the header.

Limitation on Export to Spreadsheet

When users export a table with a column that contains multiple fields to a spreadsheet, only the first piece of information displayed in the column is exported.

Related Links

The SAP Fiori elements templates support the features and settings for table rows or inline items detailed below.

For design information see the table guidelines, starting with Table Overview, and the links below.

Feature Availability

Actions

Empty Row for Data Entry in Create and Edit Modes

If users do not enter data in a new empty row, it is removed when the users save.

User-Enabled Creation of Empty Rows in Edit Mode

In edit mode, you can turn off the default creation of empty rows for tables whose maintenance mostly requires updating data in existing rows.

If the users want to create additional rows, the Create button lets them enable the automatic creation of one empty row.

On first click, the Create button creates the empty row. On subsequent clicks, the Create button moves the focus to the first editable field in the first empty table row.  After the users save their changes, the automatic creation of empty rows is turned off.

Mandatory Fields

In create and edit modes, both versions of SAP Fiori elements guide users in completing the required fields for an empty row, as follows:

• With SAP Fiori elements for OData V4, a red asterisk (*) is displayed in the column header label for the mandatory fields.
• Both SAP Fiori elements for OData V2 and V4 show an error message strip above the table:
  • When the table does not display mandatory columns. It instructs users to display the columns from the table settings.
  • When mandatory fields are not filled. In addition to the message strip for the table, the mandatory field displays a value state message. “Enter a value” is the the placeholder message text.

Drafts Saved for Rows

A draft for a once empty row is saved after the users:

• Shift the focus away from the input field in the row with SAP Fiori elements for OData V4
• Have shifted their focus away from the input field in the row and an interval of 20 seconds has passed with SAP Fiori elements for OData V2

Inline Actions

You can define actions for table rows or inline items. The action types can be:

• Actions that occur in the system while the user stays on the list report screen, for example Approve or Reject.
• Actions that navigate to a different application, for example, when the user can open a purchase requisition from a specific purchase order in the table.

When a page contains a grid table, an analytical table, or tree table that leads to object or subobject pages, users can navigate to the object or subject page at row level. The Show Detail button is not displayed in these tables. Instead, users can click the navigation indicator:   .

Direct Edit

You can enable this action to let users navigate from the table row to the corresponding object page in edit mode with the Edit icon  with SAP Fiori elements for OData V2.

This feature is available for responsive and grid tables. When it’s enabled, the object page footer displays the Save and Next  button.

For more information, see:

• Action Placement
• Terminology for Common Actions

Conditional Enablement of Navigation Buttons

In list reports and object pages:

• With SAP Fiori elements for OData V4, you can enable buttons that navigate the user to another page or application based on the value of a specific field.
• With SAP Fiori elements for OData V2, this feature requires extensions.

For example, you can enable the Generate Purchase Order button only for sales orders with the completed status.

Item Selection

Both versions of SAP Fiori elements allow you to determine whether users can select:

• One table row for a toolbar action, using a radio button.
• Multiple table rows for a toolbar action, using checkboxes.
  For an object page, you can enable selection of multiple rows for all the tables on the page, or for specific tables only.
  For an analytical table, grid table, or tree table, ask the development team to use the Multi-Selection Plugin.

When the selection of multiple rows is enabled for a table, both versions of SAP Fiori elements have the following defaults that you can change:

• Display of either the Select All or Clear All checkbox in the header of the selection column. The two versions differ in the way they do this.
  For complete information, see: Select All / Clear All.
• A limit of 200 rows that the user can select at once for grid tables, analytical tables and tree tables.
  You can change the limit. We recommend you consult the application team on how a change would impact performance.

SAP Fiori elements for OData V2

By default, single selection is enabled for a table. You can enable multiple item selection, known by application developers as multiselect.

SAP Fiori elements for OData V4

With the default auto mode, the application checks whether any table toolbar actions depend on item selection to be enabled. If not:

• In display mode, item selection is not possible.
• In edit mode, when the delete action is enabled, multiple selection is also enabled.

Instead, you can enable one of the following selection modes:

• None:
  • Display mode allows no item selection.
  • Edit mode allows multiple item selection when a Delete action is available in the table toolbar.
• Single: Both display and edit modes allow single item selection.
• Multi: Both display and edit modes allow multiple item selection.

For more information, see:

• Responsive Table: Select
• Analytical Table: Select
• Grid Table: Select
• Tree Table: Selection Modes

Delete

In responsive tables only, you can:

• Display an inline delete action.
• Prevent the deletion of certain rows.

In support of best design practices, SAP Fiori elements does not allow you to combine an inline delete action with a central delete action in the toolbar.

For more information, see Delete Single Item Rows.

Custom Actions

You can define custom inline actions.

Because custom inline actions are grouped, you cannot control their exact display order. However, you can control which columns display the groups.

Messages for Critical Actions

For actions that you set as critical, you can display one of the following after the user triggers the action:

• A message toast confirmation
• A confirmation message box to check the users want to proceed with specific critical actions

Also, the backend can require a confirmation on some actions. In this case, the confirmation message is always shown in a message box.

Example

For more information, see UI Text Guidelines for SAP Fiori Apps.

Display

You can include the display features described below in a table row or inline item.

Read-Only Field

With SAP Fiori elements for OData V4, you can set a field to display as read-only in a table, but set it as editable in another place on the UI.

Editing Status

By default, for draft-enabled applications, in a list report, the editing status is displayed:

• In the first column of a responsive table
• In a separate column, next to the key column, in a grid table. The column is unlabeled. Users can hide or display it by deselecting or selecting Edit Status in the table personalization dialog.

You can also add the semantic key to the status.

The edit status reflects the state of the object or item in the processing cycle. For example, it can give the user information about the state of completion for the item or whether it’s currently available.

• For Unsaved Changes and Locked statuses, a popover displays the full name or technical name of the user who last changed the object  when the name is available. “Another user” is displayed when it’s not.
• For Draft, Unsaved Changes and Locked statuses, a popover displays the user who last changed the item and the time of the change.

For more information, see Tables.

Rating Indicator

You can add an inline, read-only rating indicator and define a maximum rating of up to five stars. By default, five stars is the maximum.

The number of stars displayed depends on the value of a field in the backend. Decimal values are rounded up or down and when the value after the decimal point falls between x.25 and x.74, it is represented by a half star.

With extensions, you can enable editing of the rating indicator

For more information, see Rating Indicator.

Progress Indicator

You can:

• Enable an inline progress indicator to visually represent the level of completion of a project or goal, for example.
• Set the progress measure as a percentage or an absolute number, for example 3 or 8.
• Configure the progress bar to reflect the state of progress with color, based on the criticality of the progress.

For more information, see Progress Indicator.

Quick Contact View

You can add a quick view to a contact to display key contact details in a popover.

For applications with Microsoft Team integration, the contact quick view card displays options for starting an audio call, video call, or chat in with the contact in Microsoft Teams.

For more information, see Quickview.

Avatar and Other Images

You can display an avatar in the row and set a tooltip that displays when the focus is on the avatar.

For more information, see Avatar.

Highlighting Line Items

By default with SAP Fiori elements for OData V4, in draft-enabled applications, a newly created item in draft status is always highlighted in blue in grid and responsive tables.

Highlighting of new line items in draft-enabled applications is available with both SAP Fiori elements for OData V2 and V4.

You can also define highlighting and icons for line items based on their criticality.

After a newly created item is saved, it is highlighted according to the criticality, as follows:

• Green for success (criticality value 3)
• Yellow for warning (criticality value 2)
• Red for error (criticality value 1)
• No highlighting for no criticality (criticality value 0)

Responsive Table Only

In a responsive table, you can include the display features described below in a table row or inline item.

Multiple Fields in a Single Column

You can combine multiple IDs, descriptions, and action buttons in a single column in a responsive table.

For example, you can display the following in a single column:

• Company name
• Company ID
• Items in Stock
• Progress Indicator for Items in Stock
• Overall value of the Items
• Multiple Action buttons that allow the user to both:
  • Execute an action while staying on the list report page
  • Navigate to other objects and applications

The visibility and position in the table of a column that combines multiple fields can be changed.

Field Labels

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. Then, the field group label is displayed as the column title in the header.

Limitation on Export to Spreadsheet

When users export a table with a column that contains multiple fields to a spreadsheet, only the first piece of information displayed in the column is exported.

Related Links

The SAP Fiori elements templates support the features and settings for table rows or inline items detailed below.

For design information see the table guidelines, starting with Table Overview, and the links below.

Feature Availability

Actions

Empty Row for Data Entry in Create and Edit Modes

If users do not enter data in a new empty row, it is removed when the users save.

User-Enabled Creation of Empty Rows in Edit Mode

In edit mode, you can turn off the default creation of empty rows for tables whose maintenance mostly requires updating data in existing rows.

If the users want to create additional rows, the Create button lets them enable the automatic creation of one empty row.

On first click, the Create button creates the empty row. On subsequent clicks, the Create button moves the focus to the first editable field in the first empty table row.  After the users save their changes, the automatic creation of empty rows is turned off.

Mandatory Fields

In create and edit modes, both versions of SAP Fiori elements guide users in completing the required fields for an empty row, as follows:

• With SAP Fiori elements for OData V4, a red asterisk (*) is displayed in the column header label for the mandatory fields.
• Both SAP Fiori elements for OData V2 and V4 show an error message strip above the table:
  • When the table does not display mandatory columns. It instructs users to display the columns from the table settings.
  • When mandatory fields are not filled. In addition to the message strip for the table, the mandatory field displays a value state message. “Enter a value” is the the placeholder message text.

Drafts Saved for Rows

A draft for a once empty row is saved after the users:

• Shift the focus away from the input field in the row with SAP Fiori elements for OData V4
• Have shifted their focus away from the input field in the row and an interval of 20 seconds has passed with SAP Fiori elements for OData V2

Inline Actions

You can define actions for table rows or inline items. The action types can be:

• Actions that occur in the system while the user stays on the list report screen, for example Approve or Reject.
• Actions that navigate to a different application, for example, when the user can open a purchase requisition from a specific purchase order in the table.

When a page contains a grid table, an analytical table, or tree table that leads to object or subobject pages, users can navigate to the object or subject page at row level. The Show Detail button is not displayed in these tables. Instead, users can click the navigation indicator:   .

Direct Edit

You can enable this action to let users navigate from the table row to the corresponding object page in edit mode with the Edit icon  with SAP Fiori elements for OData V2.

This feature is available for responsive and grid tables. When it’s enabled, the object page footer displays the Save and Next  button.

For more information, see:

• Action Placement
• Terminology for Common Actions

Conditional Enablement of Navigation Buttons

In list reports and object pages:

• With SAP Fiori elements for OData V4, you can enable buttons that navigate the user to another page or application based on the value of a specific field.
• With SAP Fiori elements for OData V2, this feature requires extensions.

For example, you can enable the Generate Purchase Order button only for sales orders with the completed status.

Item Selection

Both versions of SAP Fiori elements allow you to determine whether users can select:

• One table row for a toolbar action, using a radio button.
• Multiple table rows for a toolbar action, using checkboxes.
  For an object page, you can enable selection of multiple rows for all the tables on the page, or for specific tables only.
  For an analytical table, grid table, or tree table, ask the development team to use the Multi-Selection Plugin.

When the selection of multiple rows is enabled for a table, both versions of SAP Fiori elements have the following defaults that you can change:

• Display of either the Select All or Clear All checkbox in the header of the selection column. The two versions differ in the way they do this.
  For complete information, see: Select All / Clear All.
• A limit of 200 rows that the user can select at once for grid tables, analytical tables and tree tables.
  You can change the limit. We recommend you consult the application team on how a change would impact performance.

SAP Fiori elements for OData V2

By default, single selection is enabled for a table. You can enable multiple item selection, known by application developers as multiselect.

SAP Fiori elements for OData V4

With the default auto mode, the application checks whether any table toolbar actions depend on item selection to be enabled. If not:

• In display mode, item selection is not possible.
• In edit mode, when the delete action is enabled, multiple selection is also enabled.

Instead, you can enable one of the following selection modes:

• None:
  • Display mode allows no item selection.
  • Edit mode allows multiple item selection when a Delete action is available in the table toolbar.
• Single: Both display and edit modes allow single item selection.
• Multi: Both display and edit modes allow multiple item selection.

For more information, see:

• Responsive Table: Select
• Analytical Table: Select
• Grid Table: Select
• Tree Table: Selection Modes

Delete

In responsive tables only, you can:

• Display an inline delete action.
• Prevent the deletion of certain rows.

In support of best design practices, SAP Fiori elements does not allow you to combine an inline delete action with a central delete action in the toolbar.

For more information, see Delete Single Item Rows.

Custom Actions

You can define custom inline actions.

Because custom inline actions are grouped, you cannot control their exact display order. However, you can control which columns display the groups.

Messages for Critical Actions

For actions that you set as critical, you can display one of the following after the user triggers the action:

• A message toast confirmation
• A confirmation message box to check the users want to proceed with specific critical actions

Also, the backend can require a confirmation on some actions. In this case, the confirmation message is always shown in a message box.

Example

For more information, see UI Text Guidelines for SAP Fiori Apps.

Display

You can include the display features described below in a table row or inline item.

Read-Only Field

With SAP Fiori elements for OData V4, you can set a field to display as read-only in a table, but set it as editable in another place on the UI.

Editing Status

By default, for draft-enabled applications, in a list report, the editing status is displayed:

• In the first column of a responsive table
• In a separate column, next to the key column, in a grid table. The column is unlabeled. Users can hide or display it by deselecting or selecting Edit Status in the table personalization dialog.

You can also add the semantic key to the status.

The edit status reflects the state of the object or item in the processing cycle. For example, it can give the user information about the state of completion for the item or whether it’s currently available.

• For Unsaved Changes and Locked statuses, a popover displays the full name or technical name of the user who last changed the object  when the name is available. “Another user” is displayed when it’s not.
• For Draft, Unsaved Changes and Locked statuses, a popover displays the user who last changed the item and the time of the change.

For more information, see Tables.

Rating Indicator

You can add an inline, read-only rating indicator and define a maximum rating of up to five stars. By default, five stars is the maximum.

The number of stars displayed depends on the value of a field in the backend. Decimal values are rounded up or down and when the value after the decimal point falls between x.25 and x.74, it is represented by a half star.

With extensions, you can enable editing of the rating indicator

For more information, see Rating Indicator.

Progress Indicator

You can:

• Enable an inline progress indicator to visually represent the level of completion of a project or goal, for example.
• Set the progress measure as a percentage or an absolute number, for example 3 or 8.
• Configure the progress bar to reflect the state of progress with color, based on the criticality of the progress.

For more information, see Progress Indicator.

Quick Contact View

You can add a quick view to a contact to display key contact details in a popover.

For more information, see Quickview.

Avatar and Other Images

You can display an avatar in the row and set a tooltip that displays when the focus is on the avatar.

For more information, see Avatar.

Highlighting Line Items

By default with SAP Fiori elements for OData V4, in draft-enabled applications, a newly created item in draft status is always highlighted in blue in grid and responsive tables.

Highlighting of new line items in draft-enabled applications is available with both SAP Fiori elements for OData V2 and V4.

You can also define highlighting and icons for line items based on their criticality.

After a newly created item is saved, it is highlighted according to the criticality, as follows:

• Green for success (criticality value 3)
• Yellow for warning (criticality value 2)
• Red for error (criticality value 1)
• No highlighting for no criticality (criticality value 0)

Responsive Table Only

In a responsive table, you can include the display features described below in a table row or inline item.

Multiple Fields in a Single Column

You can combine multiple IDs, descriptions, and action buttons in a single column in a responsive table.

For example, you can display the following in a single column:

• Company name
• Company ID
• Items in Stock
• Progress Indicator for Items in Stock
• Overall value of the Items
• Multiple Action buttons that allow the user to both:
  • Execute an action while staying on the list report page
  • Navigate to other objects and applications

The visibility and position in the table of a column that combines multiple fields can be changed.

Field Labels

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. Then, the field group label is displayed as the column title in the header.

Limitation on Export to Spreadsheet

When users export a table with a column that contains multiple fields to a spreadsheet, only the first piece of information displayed in the column is exported.

Smart Micro Chart

You can:

• Add an inline micro chart.
• Set the chart to indicate the criticality of the data shown in the chart relative to target values or value ranges.

You can choose among the following micro chart types:

• Area micro chart
• Bullet micro chart
• Line micro chart
• Micro chart/smart micro chart
• Radial micro chart
• Stacked bar micro chart

For more information on chart types, see: Choosing the Correct Chart Type.

Related Links

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

For design information, see the guidelines starting with Table Overview, and see the links below.

Feature Availability

Inline Controls for Non-Responsive Tables

These inline controls are supported for grid, analytical, and tree tables:

• Text
• Label
• ObjectStatus
• Icon
• Button
• Input
• DatePicker
• Select

• ComboBox
• MultiComboBox
• CheckBox
• Link
• Currency
• RatingIndicator
• ProgressIndicator

Also, the following when they are of a responsive or very small size:

• StackedBarMicroChart
• ComparisonMicroChart
• BulletMicroChart

Related Links

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

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

The SAP Fiori elements list report template supports the features and settings for the list report header detailed below.

For design information, see the List Report Floorplan guidelines and the links below.

Feature Availability

Feature Details

Page-Level View Management

For more information, see Header Title.

For more information, see:

• Share (Generic)
• Collaboration

For more information, see Live Update / Manual Update.

For more information, see Search.

For more information see, Pinning the Header Content.

Related Links

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

For design information, see the guidelines starting with Table Overview, and see the links below.

Feature Availability

List Report and Object Page Features

The information below relates to table toolbar actions and settings in both the list report and object page floorplans.

Table Personalization Actions

By default, Sort, Group and Order actions are enabled.

These actions are icon buttons that open the Personalization dialog to the tab for the corresponding action.

For specific use cases, you can disable the icon buttons. When you do, the user must open the Personalization dialog to access the actions.

Table-level view management is not a prerequisite for personalization.

For more information, see Table Personalization (Overview).

Show / Hide Details

The responsive table toolbar displays the Show Details action when at least one column is hidden from the screen because of limited onscreen space.

After the user clicks Show Details, the the table displays the hidden information in the pop-in area, and the action changes to Hide Details.

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.

By default in responsive tables:

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

You can change the level of importance.

Mass Edit

You can enable mass edit in responsive tables and grid tables for applications with draft handling in the:

• List report with SAP Fiori elements for OData V2
• List report and object page with SAP Fiori elements for OData V4

List Report

Users cannot apply the mass edit to a draft record.

The edit is applied to all the objects selected that don’t return errors or warnings during the update. When they do return an error or warning, none of their fields are updated.

Object Page

With SAP Fiori elements for OData V4, you can enable the mass edit for a table in the object page. When the object page is in display mode, users can apply the mass edit to the subobjects in a table.

Fields Displayed in the Edit Dialog

By default, the Edit dialog contains all the table columns that are currently visible and editable.

The application team can define the fields that display in the dialog, by both:

• Including fields in the dialog that are not displayed in the table
• Excluding fields from the dialog fields that are displayed in the table

Export

The export action exports the values in a table. When enabled, it is displayed in the table toolbar.

• With SAP Fiori elements for OData V4:
  • Export to Spreadsheet is enabled by default.
  • Export to PDF is available.
  • By default, a maximum of 1000 rows can be exported. The application development team can change the limit.
  • Columns that contain a multi-input field (1:N) are not exported.

• With SAP Fiori elements for OData V2 Export to Excel is enabled by default in:
  • A list report table
  • An object page table if the Paste icon is available

For more information see Export to Spreadsheet.

Copy and Paste

Users can copy data from external applications — such as Microsoft Excel or Microsoft Word — or from other SAP Fiori elements applications to the clipboard, and then paste the data from the clipboard to tables in SAP Fiori elements applications that are editable.

Copy to Clipboard

By default, the Copy action is displayed in the table toolbar.

With it, users can copy multiple rows or ranges of rows and columns to the clipboard.

They can select a range of cells in rows or columns:

• With their mouse, by clicking and holding the mouse button while they select the cells
• With the key combinations, described in Copying Multiple Rows and Range Selections

Paste from Clipboard

The Paste action is displayed in the table toolbar if the table supports it.

After users copy data from another SAP Fiori elements application or an external application, they can paste it to:

• The table

Users set the focus on the table or select an empty row before pasting the data. One or more new rows are created for the pasted data.

This feature is available only for draft-enabled applications and for tables where inline creation or the insertion of empty rows has been enabled.

• A cell or range of cells, only in grid and responsive tables

Users select a cell or cell range within the table and paste the data. If the selected cell or cells are in:

• • Active or draft rows, the pasted data replaces the values in those rows.
  • An empty row, new rows are created for the pasted data.

To paste, they can use the Paste action in the toolbar or use a keyboard shortcut (Ctrl+V for Microsoft Windows, Cmd+V for MacOS).

Limitations

• Pasting is supported only for fields that contain a single value, not for complex fields, such as smart links and images.
• If there are validation errors, a dialog displays an error message so the user can take remedial action.
• The greater the number of records copied, the longer the paste operation takes.
• The order of the of the data copied from the spreadsheet can differ from the order in the table in the application after the paste. SAP Fiori elements cannot control this.
• Users cannot paste data into custom columns of tables.
• This feature is not supported for custom tables.

Application-Specific Actions

You can define these actions and the text displayed on the buttons.

The application team can control when the action button is displayed and enabled.

For application-specific actions, application teams can define custom keyboard shortcuts.

For more information, see:

• Action Placement
• Terminology for Common Actions

Actions Disabled Until the User Selects a Row

You can set actions in the table toolbar to display as disabled until the user selects one or more table rows for the action.

Note that the development team may call actions that require selection “context-dependent” actions and actions that are enabled without a selection “context-independent” actions.

For more information, see UI Element States.

Conditional Enablement of Navigation Buttons

With SAP Fiori elements for OData V4, you can enable buttons that navigate the user to another page or application based on the value of a specific field.

With SAP Fiori elements for OData V2, this feature requires extensions.

For example, you can enable the Generate Purchase Order button only for sales orders with the completed status.

Messages for Critical Actions

For actions that you set as critical, you can display one of the following after the user triggers the action:

• A message toast confirmation
• A confirmation message box to ensure the user wants to proceed with specific critical actions

Also, the backend can require a confirmation on some actions. In this case, the confirmation message is always shown in a message box.

Example

For more information, see:

• Replacing Placeholder Text
• Message Handling
• UI Text Guidelines for SAP Fiori Apps

Messages for Destructive Actions

By default, a message is displayed for confirmation of an action that will delete or destroy important data.

Example

For more information, see:

• Message Handling
• UI Text Guidelines for SAP Fiori Apps

Multiple Views for a Table

You can display a table with multiple views, for example, each view of the same table can display different columns or prefiltered states.

For a maximum of three views, a segmented button is displayed. For four or more, the select control is displayed.

With SAP Fiori elements for V4, you can also display the row count for each view next to the view name.

List Report Only Features

The information below relates only to table toolbar actions and settings in the list report floorplan.

Standard Actions

By default, Create and Delete are enabled.

You can disable them.

You can also enable or disable the Delete button based on conditions specified in the backend.

Example

You can disable deletion for a sales order that has already been paid. When a user selects an item that cannot be deleted, the Delete button is disabled. In addition, if the user navigates from this item in the list report to the object page, the Delete button is hidden.

Create Object Actions

By default, the create via the object page feature is enabled. The create action opens the object page in create mode so the user can enter the data. Alternatively, you can enable object creation as described the sections below:

Via a Dialog

The action opens a dialog in modal view so the user can enter the data.

With SAP Fiori elements for OData V2, you can:

• Include a maximum of eight fields in the dialog
• Enable filter values saved in the filter bar to prefill fields in the dialog

With Default Values That Prefill Fields for the New Object

This feature is available with:

• SAP Fiori elements for OData V2 for applications without draft handling
• SAP Fiori elements for OData V4

Via a Dialog with a Reference to an Existing Object of the Same Type

With SAP Fiori elements for OData V4, application developers can build a custom create action via a dialog that lets the user create a new object with a reference to an existing object of the same type.

The user:

1. Clicks the action button.
   You can name the button to suit your use case.
2. Selects the value of the existing object to reference in the dialog.
3. Completes the fields for the new object by selecting one or more values to copy from the existing one.
4. Completes additional fields for the new object in the object page.

Copy Object

You can place a copy action button in the table toolbar to let the user to create a new object with the same data as the selected object.

You set the label for the button according to your use case. Otherwise, the default label is Copy.

In the toolbar, the Copy button is displayed after the Create button.

Hiding Actions in Multiple Content Layout

You can hide an action from a toolbar for a specific table when the list report contains multiple views with multiple tables.

For more information, see:

• Multiple Content Layout
• General Layout

Add Card to Insights

By default, the Add Card to Insights option is displayed in the overflow toolbar of list report tables with the single content layouts when My Home in SAP S/4HANA Cloud is enabled.

You can ask the application development team to turn the option off.

For more information, see: Simple Content Layout.

Object Page Only Features

The information below relates only to table toolbar actions and settings in the object page floorplan.

Search

You can enable a search on the table.

The limit for search strings is 1000 characters.

For more information, see Search.

Edit

By default, Edit is displayed when the business object shown in the table is editable.

Delete

By default, Delete is displayed in edit mode when the business object shown in the table is deletable.

You can enable or disable the Delete action to allow users to delete only in certain conditions.

For example, after the sales items for a Sales Order have shipped, you can hide the Delete action for the items. When a user selects an item that cannot be deleted, the Delete action is disabled.

When multiple selection is enabled for the table, the Delete action is enabled if at least one selected item is deletable.

Subobject Creation

By default:

• Create is displayed in edit mode when the business object shown in the table is editable. For specific circumstances when the Create button is disabled, see Create Action Visibility below.
• The default creation action is via the suboject page — the action opens the subobject page in create mode so the user can enter the data.

You can:

• Enable or disable the Create action to allow users to create subobjects only in certain conditions. For example, after a sales order reaches the Delivery is Shipped status, you can hide the Create Sales Item action.
• Enable creation of a subobject via a dialog with 8 fields maximum. The action opens a dialog in modal view so the user can enter the data. The dialog must contain all the mandatory fields for the subobject. With SAP Fiori elements for OData V2, you can enable filter values saved in the filter bar to prefill fields in the Create dialog.
• Enable inline create for draft-enabled applications in grid and responsive tables with SAP Fiori elements for V4. See Inline Creation below.
• Enable default values to prefill the fields for the new object. This feature is available with SAP Fiori elements for OData V4, and with SAP Fiori elements for OData V2 for applications without draft handling.

For more information, see:

• Create Items
• Add Items

Create Action Visibility

Whether or not the Create action is visible in the table toolbar depends on:

• The object page mode.
• Whether the flow is global or local.
• Where the user enters the data for the new subobject — in the subobject page or directly in the table with the inline edit.

Inline Creation

For more information, see Add Items.

Prefilling Fields for a New Object

You can turn this on in draft-enabled applications for the default create action via the object page, where the user navigates to another application to enter the data in the new object page.

The new object must be the main object on the object page.

You determine both the fields to prefill and the default values for the fields.

Full Screen Mode for Table Display

You can enable full screen mode for a table. However, it is generally not recommended.

Users click the Maximize action in the toolbar to display to the table in a dialog. They can return to the object page by clicking either the Minimize or Close action.

For more information on the restrictions for this feature, see Maximize/Minimize.

Content Switch for Table Views

The number of views defined for a table determines the UI control that lets users switch the table views:

• A segmented button for a maximum of three views
• A select control for four or more views.

By default, the count or number of records in the view is not displayed next to the title of the content switch for table views for performance reasons. Talk to the development team about how displaying the counts impacts performance for your use case.

Related Links

The SAP Fiori elements object page template supports the features and settings for the object page content area detailed below.

For design information, see the Object Page Floorplan guidelines and the links below.

Feature Availability

Content Area

Draft Object Validation

By default, data validation for the object page happens only when the users save the object so they enter data without interruption.

They can trigger data validation by pressing the Enter key while their cursor is in a field on the object or subobject page.

For more information, see: Form Field Validation

Navigation Bar

By default, the anchor bar is generated when the object page has more than one section.

It lets users navigate to the individual content area sections.

You can:

• Hide the anchor bar when you only have one section.
• Replace it with a tab bar.

With extensions, you can replace the buttons with another type of control.

If there is no Anchor Bar, but there is editable information in the header, the first temporary section in the Object Page which controls the header content will have a section title called ‘Header’.

For more information, see:

• Navigation Bar
• Anchor Bar Navigation
• Tab Bar Navigation

Sections and Subsections

You can add sections and subsections to the content area.

Sections contain only subsections. You build the subsection content with tables, charts, and forms.

When the object page uses:

• Tab bar navigation, the section title isn’t displayed in the content area
• Anchor bar navigation, only the title of the first section is hidden in the content area, unless the first section contains a table

Section and Subsection Titles

To minimize both the number of titles displayed and redundancies among the title values:

• When a section or subsection contains a single table or chart control, only the control title is displayed, but its value is replaced by the section or subsection title.
• For sections or subsections that contain a single text area, with SAP Fiori elements for OData V4, application teams can enable an option to display the section or subsection title instead of the text area label when the object page is in display mode. With the option enabled, the label is only displayed in edit mode if the field is mandatory.

For more information, see: Sections and Subsections.

Reuse Components as Sections

You can embed a reuse component as a section in the object page.

Subsections

Tables

You can include a table in a subsection.

When a table is the only content in a subsection, the subsection title is not displayed. Instead, the title of the table shows the value assigned to the subsection title.

For more information on SAP Fiori elements capabilities for tables, see the articles under SAP Fiori Elements: Table, starting with Table Types.

Charts

You can include a single chart facet in a subsection.

In the chart, you can:

• Display measures, their aggregation calculations, and dimensions to categorize the measures.
• Add custom actions to the toolbar for a chart and define whether they are enabled at all times or only after the user selects part of the chart for the action.
• Allow users to personalize the chart settings

When a chart is the only content in a subsection, the subsection title is not displayed. Instead the title of the chart shows the value assigned to the subsection title.

SAP Fiori Elements for OData V2

Charts are only supported for business objects or services that are not draft enabled or are read-only.

SAP Fiori Elements for OData V4

You can define a chart for a draft-enabled business object. The chart only displays active data, not data entered into an unsaved draft record.

For more information, see Chart (VizFrame).

For more information on chart options, see Chart.

Views for Tables and Charts

You can turn on views for:

• All the tables and charts on the page
• Individual tables and charts

For more information, see Views (Variant Management).

Address

You can add one or more address fields:

• As a separate subsection
• As part of a field group within a subsection
• To a quick view with smart link navigation

For more information, see:

• Quickview
• Quickview Examples

Display of Related Properties Together

You can display two related properties side-by-side and with a single label in display mode.

For example, the label Date Time can display with the properties date and time side-by-side, even when they are distinct properties in the back end.

You can separate the values with a delimiter such as a slash (/) or a hyphen (-).

In edit mode, the fields can be edited separately.

Related Properties as Links

The related properties can also display as links.

Forms

You can add action buttons to the toolbar for a form contained in a subsection.

With SAP Fiori elements for OData V4, you can also add an action next to the form header.

The action types can be:

• Actions that occur in the system while the user stays on the object page.
• Actions that navigate to a different application, for example, when the user can open a purchase requisition from a specific purchase order.

Conditional Enablement of Navigation Buttons

You can enable buttons that navigate the user to another page or application based on the value of a specific field with SAP Fiori elements for OData V4. To achieve this with SAP Fiori elements for OData V2 requires extensions.

For example, you can enable the Generate Purchase Order button only for sales orders with the completed status.

Columns in a Form

To optimize onscreen space, the default number of columns in a form depends on the screen size, as follows:

Groups in a Form

You can group fields in a form and assign a name to the group.

Note that the group name is displayed only when a group contains fields.

User-Controlled Load of Fields with Low Importance

To improve the performance on application startup, you can prevent form fields with low importance from loading until the user clicks Show Details with SAP Fiori element for OData V4.

After the user clicks the button, the fields are loaded and the Hide Details button is displayed.

Text Control

By default, with SAP Fiori elements for OData V4, in edit mode, the default length of the text control allows for the entry of four lines of text.

You can:

• Set a maximum number of lines for the text control that’s greater than four.
• Enable growing mode: The length of the text control on first load allows for four lines. After the user has entered that number of lines, the length grows by one line at a time until it reaches the maximum number. A scrollbar is displayed next to the text entry area.
• Display below the text area the number of characters allowed in it. As the users enter text, the number decreases to show how many characters remain.

A notification is displayed if the users try to enter text beyond the limit.

In display mode, the text is truncated to 100 characters and a More link allows the user to display the full text. Alternatively, you can set the full text to display in a popover when the the user clicks More.

File Upload

With SAP Fiori elements for OData V4, users can upload a file to an object page property and delete the file.

For example, the sales order object can have a property for a contract and users can upload the contract file to the property.

The application developers can define the file size and types allowed for upload.

Dynamic Side Content

You can display additional content to the right of an object page subsection. Consult with the development team on doing this with a standard extension.

With this feature, the subsection toolbar contains a Show Details/Hide Details action for users to control the display of the dynamic side content. By default, the side content is hidden. You can show it instead. You can also rename the action to make it meaningful to the end user.

For more information, see:

• Dynamic Side Content
• Object Page: Dynamic Side Content

Subsection Behavior

Subsection Loading Behavior

By default, the subsection starts loading after the main object page elements are loaded.

You can change the loading behavior to load the subsection after the header data is loaded.

Example

When the subsection contains a table or chart and you want to allow the user to filter in the header before subsection data loads.

Width for Content Display in a Subsection

When you mix content — such as forms and tables — in one subsection, you can adjust the width allotted to each content type to display a table next to a form.

Content Visibility

Sections, Subsections, Quickviews, and Tables

By default, the object page displays these components.

You can set the entire components or selected content in the components to be displayed or hidden in the content area, according to the object’s state. For example, you can hide the Delivery section in a Sales Order until the order has a status where the delivery is planned.

User-Controlled Visibility

You can enable the Show More/Show Less button in the bottom right corner of a section to let users control the display of subsection content.

• When the subsection is hidden, Show More is displayed.
• When the subsection shows, the Show Less link is displayed.

Visibility of Smart Form Fields

By default, all smart form fields have the high importance setting and show on all screen sizes.

You can lower the level of importance for the fields to hide them on smaller screens.

According to the importance assigned to the field, it is displayed as follows:

• High (default): On all (small, medium, and large) screen sizes.
• Medium: On large and medium screens only.
• Low: On large screens only

For more information, see Responsiveness.

Related Links

The SAP Fiori elements templates support the features and settings for table rows or inline items detailed below.

For design information see the table guidelines, starting with Table Overview, and the links below.

Feature Availability

Actions

Empty Row for Data Entry in Create and Edit Modes

If users do not enter data in a new empty row, it is removed when the users save.

User-Enabled Creation of Empty Rows in Edit Mode

In edit mode, you can turn off the default creation of empty rows for tables whose maintenance mostly requires updating data in existing rows.

If the users want to create additional rows, the Create button lets them enable the automatic creation of one empty row.

On first click, the Create button creates the empty row. On subsequent clicks, the Create button moves the focus to the first editable field in the first empty table row.  After the users save their changes, the automatic creation of empty rows is turned off.

Mandatory Fields

In create and edit modes, both versions of SAP Fiori elements guide users in completing the required fields for an empty row, as follows:

• With SAP Fiori elements for OData V4, a red asterisk (*) is displayed in the column header label for the mandatory fields.
• Both SAP Fiori elements for OData V2 and V4 show an error message strip above the table:
  • When the table does not display mandatory columns. It instructs users to display the columns from the table settings.
  • When mandatory fields are not filled. In addition to the message strip for the table, the mandatory field displays a value state message. “Enter a value” is the the placeholder message text.

Drafts Saved for Rows

A draft for a once empty row is saved after the users:

• Shift the focus away from the input field in the row with SAP Fiori elements for OData V4
• Have shifted their focus away from the input field in the row and an interval of 20 seconds has passed with SAP Fiori elements for OData V2

Inline Actions

You can define actions for table rows or inline items. The action types can be:

• Actions that occur in the system while the user stays on the list report screen, for example Approve or Reject.
• Actions that navigate to a different application, for example, when the user can open a purchase requisition from a specific purchase order in the table.

When a page contains a grid table, an analytical table, or tree table that leads to object or subobject pages, users can navigate to the object or subject page at row level. The Show Detail button is not displayed in these tables. Instead, users can click the navigation indicator:   .

Direct Edit

You can enable this action to let users navigate from the table row to the corresponding object page in edit mode with the Edit icon  with SAP Fiori elements for OData V2.

This feature is available for responsive and grid tables. When it’s enabled, the object page footer displays the Save and Next  button.

For more information, see:

• Action Placement
• Terminology for Common Actions

Conditional Enablement of Navigation Buttons

In list reports and object pages:

• With SAP Fiori elements for OData V4, you can enable buttons that navigate the user to another page or application based on the value of a specific field.
• With SAP Fiori elements for OData V2, this feature requires extensions.

For example, you can enable the Generate Purchase Order button only for sales orders with the completed status.

Item Selection

Both versions of SAP Fiori elements allow you to determine whether users can select:

• One table row for a toolbar action, using a radio button.
• Multiple table rows for a toolbar action, using checkboxes.
  For an object page, you can enable selection of multiple rows for all the tables on the page, or for specific tables only.
  For an analytical table, grid table, or tree table, ask the development team to use the Multi-Selection Plugin.

When the selection of multiple rows is enabled for a table, both versions of SAP Fiori elements have the following defaults that you can change:

• Display of either the Select All or Clear All checkbox in the header of the selection column. The two versions differ in the way they do this.
  For complete information, see: Select All / Clear All.
• A limit of 200 rows that the user can select at once for grid tables, analytical tables and tree tables.
  You can change the limit. We recommend you consult the application team on how a change would impact performance.

SAP Fiori elements for OData V2

By default, single selection is enabled for a table. You can enable multiple item selection, known by application developers as multiselect.

SAP Fiori elements for OData V4

With the default auto mode, the application checks whether any table toolbar actions depend on item selection to be enabled. If not:

• In display mode, item selection is not possible.
• In edit mode, when the delete action is enabled, multiple selection is also enabled.

Instead, you can enable one of the following selection modes:

• None:
  • Display mode allows no item selection.
  • Edit mode allows multiple item selection when a Delete action is available in the table toolbar.
• Single: Both display and edit modes allow single item selection.
• Multi: Both display and edit modes allow multiple item selection.

For more information, see:

• Responsive Table: Select
• Analytical Table: Select
• Grid Table: Select
• Tree Table: Selection Modes

Delete

In responsive tables only, you can:

• Display an inline delete action.
• Prevent the deletion of certain rows.

In support of best design practices, SAP Fiori elements does not allow you to combine an inline delete action with a central delete action in the toolbar.

For more information, see Delete Single Item Rows.

Custom Actions

You can define custom inline actions.

Because custom inline actions are grouped, you cannot control their exact display order. However, you can control which columns display the groups.

Messages for Critical Actions

For actions that you set as critical, you can display one of the following after the user triggers the action:

• A message toast confirmation
• A confirmation message box to check the users want to proceed with specific critical actions

Also, the backend can require a confirmation on some actions. In this case, the confirmation message is always shown in a message box.

Example

For more information, see UI Text Guidelines for SAP Fiori Apps.

Display

You can include the display features described below in a table row or inline item.

Read-Only Field

With SAP Fiori elements for OData V4, you can set a field to display as read-only in a table, but set it as editable in another place on the UI.

Editing Status

By default, for draft-enabled applications, in a list report, the editing status is displayed:

• In the first column of a responsive table
• In a separate column, next to the key column, in a grid table. The column is unlabeled. Users can hide or display it by deselecting or selecting Edit Status in the table personalization dialog.

You can also add the semantic key to the status.

The edit status reflects the state of the object or item in the processing cycle. For example, it can give the user information about the state of completion for the item or whether it’s currently available.

• For Unsaved Changes and Locked statuses, a popover displays the full name or technical name of the user who last changed the object  when the name is available. “Another user” is displayed when it’s not.
• For Draft, Unsaved Changes and Locked statuses, a popover displays the user who last changed the item and the time of the change.

For more information, see Tables.

Rating Indicator

You can add an inline, read-only rating indicator and define a maximum rating of up to five stars. By default, five stars is the maximum.

The number of stars displayed depends on the value of a field in the backend. Decimal values are rounded up or down and when the value after the decimal point falls between x.25 and x.74, it is represented by a half star.

With extensions, you can enable editing of the rating indicator

For more information, see Rating Indicator.

Progress Indicator

You can:

• Enable an inline progress indicator to visually represent the level of completion of a project or goal, for example.
• Set the progress measure as a percentage or an absolute number, for example 3 or 8.
• Configure the progress bar to reflect the state of progress with color, based on the criticality of the progress.

For more information, see Progress Indicator.

Quick Contact View

You can add a quick view to a contact to display key contact details in a popover.

For applications with Microsoft Team integration, the contact quick view card displays options for starting an audio call, video call, or chat in with the contact in Microsoft Teams.

For more information, see Quickview.

Avatar and Other Images

You can display an avatar in the row and set a tooltip that displays when the focus is on the avatar.

For more information, see Avatar.

Highlighting Line Items

By default with SAP Fiori elements for OData V4, in draft-enabled applications, a newly created item in draft status is always highlighted in blue in grid and responsive tables.

Highlighting of new line items in draft-enabled applications is available with both SAP Fiori elements for OData V2 and V4.

You can also define highlighting and icons for line items based on their criticality.

After a newly created item is saved, it is highlighted according to the criticality, as follows:

• Green for success (criticality value 3)
• Yellow for warning (criticality value 2)
• Red for error (criticality value 1)
• No highlighting for no criticality (criticality value 0)

Responsive Table Only

In a responsive table, you can include the display features described below in a table row or inline item.

Multiple Fields in a Single Column

You can combine multiple IDs, descriptions, and action buttons in a single column in a responsive table.

For example, you can display the following in a single column:

• Company name
• Company ID
• Items in Stock
• Progress Indicator for Items in Stock
• Overall value of the Items
• Multiple Action buttons that allow the user to both:
  • Execute an action while staying on the list report page
  • Navigate to other objects and applications

The visibility and position in the table of a column that combines multiple fields can be changed.

Field Labels

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. Then, the field group label is displayed as the column title in the header.

Limitation on Export to Spreadsheet

When users export a table with a column that contains multiple fields to a spreadsheet, only the first piece of information displayed in the column is exported.

Related Links

The SAP Fiori elements object page template supports the features and settings for the object page header detailed below.

For design information, see the Object Page Floorplan guidelines and the links below.

Feature Availability

Behavior and Interaction

Collapsed/Expanded State

Header Field Editability

By default, in edit mode the header is:

• Not editable with SAP Fiori elements for OData V2
• Editable with SAP Fiori elements for OData V4

You can change the default.

Even when the header is editable, certain fields or facets in the header may not be editable, for example, micro chart facets or text fields marked as ReadOnly.

Highlighting Values Based on Criticality

You can assign colors and icons to text to indicate the criticality of a field value.

With SAP Fiori elements for OData V4, you can add a quick view to text that’s been set to display in a color to indicate the criticality of its value. The text is displayed underlined as a link so users know the quick view is available.

Components

Title

Breadcrumbs

Object Marker