Class sap.m.TableModule: sap/m/Table
sap.m.Table
control provides a set of sophisticated and convenience functions for responsive table design. To render the sap.m.Table
properly, the order of the columns
aggregation should match with the order of the items cells
aggregation. Also sap.m.Table
requires at least one visible sap.m.Column
in columns
aggregation. For mobile devices, the recommended limit of table rows is 100 (based on 4 columns) to assure proper performance. To improve initial rendering on large tables, use the growing
feature.
Since: 1.16.
sClassName
and enriches it with the information contained in oClassInfo
. Accepts an object literal mSettings
that defines initial property values, aggregated and associated objects as well as event handlers. See sap.ui.base.ManagedObject for a general description of the syntax of the settings object.
The supported settings are:
- Properties
- backgroundDesign : sap.m.BackgroundDesign (default: Translucent)
- fixedLayout : boolean (default: true)
- showOverlay : boolean (default: false)
- Aggregations
- columns : sap.m.Column[]
In addition, all settings applicable to the base type sap.m.ListBase can be used as well.
{string} | sId? | Id for the new control, generated automatically if no id is given |
{object} | mSettings? | Initial settings for the new control |
sClassName
and enriches it with the information contained in oClassInfo
. oClassInfo
might contain the same kind of information as described in sap.m.ListBase.extend.
{string} | sClassName | Name of the class being created |
{object} | oClassInfo? | Object literal with information about the class |
{function} | FNMetaImpl? | Constructor function for the metadata object; if not given, it defaults to sap.ui.core.ElementMetadata |
{function} | Created class / constructor function |
{sap.ui.base.Metadata} | Metadata object describing this class |
columns
. {sap.m.Column} | oColumn | the column to add; if empty, nothing is inserted |
{sap.m.Table} | Reference to this in order to allow method chaining |
columns
. {sap.m.Table} | Reference to this in order to allow method chaining |
backgroundDesign
. Sets the background style of the table. Depending on the theme, you can change the state of the background from Solid
to Translucent
or to Transparent
.
Default value is Translucent
.
{sap.m.BackgroundDesign} | Value of property backgroundDesign |
{Boolean} | bSort? | set true to get the columns in an order that respects personalization settings |
{sap.m.Column[]} | columns of the Table |
fixedLayout
. Defines the algorithm to be used to layout the table cells, rows, and columns. By default, a table is rendered with fixed layout algorithm. This means the horizontal layout only depends on the table's width and the width of the columns, not the contents of the cells. Cells in subsequent rows do not affect column widths. This allows a browser to layout the table faster than the auto table layout since the browser can begin to display the table once the first row has been analyzed.
When this property is set to false
, sap.m.Table
is rendered with auto layout algorithm. This means, the width of the table and its cells depends on the contents of the cells. The column width is set by the widest unbreakable content inside the cells. This can make the rendering slow, since the browser needs to read through all the content in the table before determining the final layout. Note: Since sap.m.Table
does not have its own scrollbars, setting fixedLayout
to false can force the table to overflow, which may cause visual problems. It is suggested to use this property when a table has a few columns in wide screens or within the horizontal scroll container (e.g sap.m.Dialog
) to handle overflow. In auto layout mode the width
property of sap.m.Column
is taken into account as a minimum width.
Default value is true
.
- Since:
- 1.22
{boolean} | Value of property fixedLayout |
showOverlay
. Setting this property to true
will show an overlay on top of the table content and prevents the user interaction with it.
Default value is false
.
- Since:
- 1.22.1
{boolean} | Value of property showOverlay |
sap.m.Column
in the aggregation columns
. and returns its index if found or -1 otherwise. {sap.m.Column} | oColumn | The column whose index is looked for |
{int} | The index of the provided control in the aggregation if found, or -1 otherwise |
columns
. {sap.m.Column} | oColumn | the column to insert; if empty, nothing is inserted |
{int} | iIndex | the 0 -based index the column should be inserted at; for a negative value of iIndex , the column is inserted at position 0; for a value greater than the current size of the aggregation, the column is inserted at the last position |
{sap.m.Table} | Reference to this in order to allow method chaining |
columns
. Additionally, it unregisters them from the hosting UIArea.
{sap.m.Column[]} | An array of the removed elements (might be empty) |
columns
. {int|string|sap.m.Column} | vColumn | The columnto remove or its index or id |
{sap.m.Column} | The removed column or null |
backgroundDesign
. Sets the background style of the table. Depending on the theme, you can change the state of the background from Solid
to Translucent
or to Transparent
.
When called with a value of null
or undefined
, the default value of the property will be restored.
Default value is Translucent
.
{sap.m.BackgroundDesign} | sBackgroundDesign | New value for property backgroundDesign |
{sap.m.Table} | Reference to this in order to allow method chaining |
fixedLayout
. Defines the algorithm to be used to layout the table cells, rows, and columns. By default, a table is rendered with fixed layout algorithm. This means the horizontal layout only depends on the table's width and the width of the columns, not the contents of the cells. Cells in subsequent rows do not affect column widths. This allows a browser to layout the table faster than the auto table layout since the browser can begin to display the table once the first row has been analyzed.
When this property is set to false
, sap.m.Table
is rendered with auto layout algorithm. This means, the width of the table and its cells depends on the contents of the cells. The column width is set by the widest unbreakable content inside the cells. This can make the rendering slow, since the browser needs to read through all the content in the table before determining the final layout. Note: Since sap.m.Table
does not have its own scrollbars, setting fixedLayout
to false can force the table to overflow, which may cause visual problems. It is suggested to use this property when a table has a few columns in wide screens or within the horizontal scroll container (e.g sap.m.Dialog
) to handle overflow. In auto layout mode the width
property of sap.m.Column
is taken into account as a minimum width.
When called with a value of null
or undefined
, the default value of the property will be restored.
Default value is true
.
{boolean} | bFixedLayout | New value for property fixedLayout |
- Since:
- 1.22
{sap.m.Table} | Reference to this in order to allow method chaining |
showOverlay
. Setting this property to true
will show an overlay on top of the table content and prevents the user interaction with it.
When called with a value of null
or undefined
, the default value of the property will be restored.
Default value is false
.
{boolean} | bShowOverlay | New value for property showOverlay |
- Since:
- 1.22.1
{sap.m.Table} | Reference to this in order to allow method chaining |