Show the item counter together with the table title, unless:

• You expect this to cause performance problems.
• You use a responsive table and use the More button for loading additional items. Use the item counter on the More button instead.

• Do not turn off the info bar (property: useInfoBar).
• In the default delivery, sort items in a meaningful order. This works only for the grid table, tree table, and analytical table. You can also provide default filter settings (all tables) and grouping (responsive table and analytical table only) (annotation:
  PresentationVariant).
• If the smart table is used together with a filter bar (property:
  smartFilterId), do not offer filtering for the smart table itself.

• Only offer the Export to Spreadsheet option if your end users typically export the data shown in the table to work with it in a spreadsheet application.

  • This is usually the case if data is collected from several systems and analyzed in the spreadsheet application.
  • This is not usually the case for worklists, attachment lists, tables with only a few items, shopping carts, or data that does not need to be analyzed.

• If you offer the Export to Spreadsheet button, use the front-end export.

• If your table has columns with non-textual content, provide a textual equivalent for those columns. Non-textual content is not exported.

With both methods, the file size is limited by the available browser memory. As a result, exporting large tables can lead to memory overflows and crash the export process.

Apply the following size restrictions as a rule-of-thumb:

• For the front-end export, do not export more than 2 million table cells on desktop browsers or 100,000 table cells on tablets and phones.
• For the back-end export, do not export more than 100,000 table cells.

For larger tables, consider using custom-built, specialized export solutions instead.

• Use Maximize / Minimize only if really needed.
• Do not use it in list reports, worklists, analytical list pages, and initial pages. Even in object pages it barely adds value.
• Do not use it for responsive tables with a More button.
• Do not use it if the table is in a dialog or popover.

• If additional actions are needed, use a custom toolbar for the table. The smart table can also add integrated functionality, such as a table title, item counter, variant management, view settings, and export to spreadsheet to the custom toolbar (aggregation: customToolbar).
• If you are using a custom toolbar in a responsive table, show the bottom border of the toolbar. For all other tables, do not show it (property: style, value: clear).
• The property placeToolbarInTable adds the toolbar to the corresponding aggregation of the inner SAPUI5 table. In most cases, set this to “true”, especially when you are using the custom toolbar with the responsive table. Otherwise, the table toolbar cannot stick to the top of the surrounding layout container.

• For the responsive table, the info bar is mandatory.
• For all other tables, do not show the info bar.

• Use the responsive table wherever possible. Use the other table types only if really needed. If you use another table, provide a fallback solution for phones.

• For the responsive table, the smart table initially loads 20 items and shows a More button for loading additional items. Change this behavior if:

  • You expect fewer than 200 items. Load all items from the start (sap.m.Table, property: growing).
  • You expect more than 200 items. Adapt the number of items initially loaded to cater for large screens, and load additional items automatically when the user scrolls down (sap.m.Table, property: growingScrolllToLoad).

• The property tableBindingPath defines the path from which the data is fetched.
• The property enableAutoBinding fetches the data automatically as soon as the corresponding OData model is initialized and the smart table is created.

If a column needs to be in the model but should not be shown, you can hide it from both the table and the P13n dialog (property: ignoredFields, annotation: UI.Hidden).

Use this option if:

• A column is needed to provide an ID that is used for navigation purposes only. However, you only want to display the corresponding text on the UI, and not the ID.
• The values of a column are needed to perform calculations, but only the results are shown on the UI.

You can use the property requestAtLeastFields to request additional (technical) columns with every request, regardless of whether these columns are currently visible. This does not work with the analytical table.

The property ignoreFromPersonalization is only available with the analytical table. It loads additional key fields that are needed for aggregations but are never visible.

• Keep the number of initially visible columns to a minimum. Avoid pop-in behavior (responsive table) or horizontal scrolling (all other tables) on a tablet screen size in the default delivery (annotation: PresentationVariant/ LineItem).
• Also keep the number of additional columns offered in the personalization settings to a minimum. You can use the P13n dialog to let users show/hide the columns. Select the columns offered in the P13n dialog carefully. Do not just show all columns available in the backend tables (annotation: sap:visible, value: false).

For the responsive table, enableAutoColumnWidth also applies the following changes:

• The smart table property demandPopin is set to true.
• The responsive table property fixedLayout is set to Strict.
• The responsive table property contextualWidth is set to Auto.
• Column resizing is enabled for all columns (including custom columns).
• Labels in the column headers no longer wrap. If there is not enough space, they truncate.

In this case, the properties above must not be managed by the app.

To add or override columns (“custom columns”):

• Use an XML view to define the underlying table with just the columns to be added/overridden.
• To override columns, provide the column key of the column you want to exchange.
• Add this “unfinished” table to the smart table. The smart table adds all the automatically generated columns and additional features.

Make sure that the sortProperty and the filterProperty are set (define p13nData via the aggregation CustomData). If you offer the export to spreadsheet option, ensure that it works as expected.

If you are using a responsive table, also make sure that the responsive behavior for this column works as expected (sap.m.Column, property: importance).

From a performance perspective, using the smart field is more expensive than using the controls provided by the smart table directly. With this in mind, follow the rules below:

• For read-only tables, use the controls provided by the smart table.

• For simple editing cases with no need for FieldControl or value help on input fields, use the controls provided by the smart table.

• For more complex editing cases, use smart fields.

• For switching between read-only and edit modes:

  • In read-only mode, use the controls provided by the smart table.
  • In edit mode, use either smart fields or the controls provided by the smart table, based on the guidance above.

• For all other cases, provide instructions on how to fill the table with data (aggregation: noData).
• The “no data” text can be exchanged at runtime. Use specific texts for different situations.
• Avoid displaying a table without any items, especially when the app is initially loaded.

To show that an item contains an error,

• Highlight the row accordingly.
• Add the string (contains errors) and place it at the bottom of the column that identifies the line item (responsive table) or in the Editing Status column (all other tables).

If used with the responsive table, enable the pop-in behavior (sap.ui.comp.smarttable.SmartTable, property: demandPopin, value: true). Ensure that the most important columns stay in the tabular layout as long as possible (annotation: UI.Importance). The most important columns are those that contain the following information:

• The column that identifies the line item.
• The column that contains the key attribute.

• To change the layout of the pop-in area (Block, GridSmall, GridLarge), you need to create a responsive table with the corresponding settings (property: popinLayout). You do not need to define anything else. Hand this responsive table over to the smart table. The smart table then takes care of the rest (such as adding columns, and so on).
• Do not use the annotation UI.Importance together with the grid table, tree table, or analytical table. It hides columns with low priority on phones or narrow-width screens, without the possibility to show them again.