Table

Use

In a Web Dynpro table data is displayed two dimensionally in table cells arranged in rows and columns. Tables are scrollable.

The Web Dynpro table consists of the higher-level Table UI element and several view elements for table columns, TableColumn. The Table contains properties that apply to the whole table, such as one to determine whether entries can be made in the table or not (readOnly=true). Some properties can also be changed row by row (for example, rowSelectable). In a Table, the properties of the aggregated Header-Caption determine the column heading. The TableColumn contains properties that apply to the entire column as well as properties that apply to cells and whose values can vary in each row depending on the binding.

The column heading is implemented by the Header aggregation using a Caption UI element. The second aggregation of TableColumn with the name TableCellEditor contains a UI element that is used to display the cell contents in the column. If the relevant UI elements are bound to readOnly attributes, data cannot be entered in them in the Table.

The Table represents the elements of the context node bound to dataSource. All the properties of a TableCellEditor that are bound to an attribute of dataSource or to context nodes within the dataSource, do not assume the value of the lead selection of the node as is usual, instead they have the value of the selected row.

You can find information about issues you must consider when setting the column width for the layout of a Table or TableColumn in SAP Note 1253282 Information published on SAP site .

Visualization

A Table consists of the following:

Table header (Table header)

This aggregation is optional and can be filled in SE80 using the Insert Header context menu entry.
ToolBar

This aggregation is optional and can be filled in SE80 using the Insert Toolbar context menu entry.
Column headers/hierarchy of column headers (TableColumn header)

If the header is set to Caption.visibility=none for all columns (including hidden ones), the row with the column headers is hidden.
Data rows with TableCellEditors (Insert Cell Editor)

The content of the data rows is determined by:
- TableColumns and cell variants
- Content of Table.dataSource
- TableCellEditors
Note

For more information about using the TextEdit UI element as the cell editor, see Editing Text in a Table or CTable.
Scroll bars

A scroll bar is displayed on the right edge of each Table.

When you scroll through a Table, a tooltip is displayed. You can specify the texts for these scroll tips using the SCROLL_TIP_PROVIDER aggregation. If new data needs to be loaded, releasing the mouse triggers the round trip to the server. There are also various ways to scroll in columns .

In addition to these standard functions, a Table can also contain more complex features:

Feature	Description
Drag and Drop	Drag and drop rows in a Table or cell contents
Hierarchical Tables	TreeByKeyTableColumn and TreeByNestingTableColumn
Popins	Popins at cell and row level
Header Group	Collection of identical headers for multiple rows or columns
Row Grouping	Collection of identical fields in a column
Variants	TableCellVariants
Selection in Tables	Selection and selection column, selection menu and hierarchy menu
Sorting Columns	You can define a Table or the single columns (TableColumn) as sortable.
Column Filtering	You can filter individual TableColumns in a Table according to specific criteria.
Column Scrolling	Various options for column scrolling
Data Binding	Connection between properties and context
Method Handler	Special functions can be accessed from the method handler IF_WD_TABLE_METHOD_HNDL. You can find more information about the interface in the system under the relevant object.
Accessibility	Support for the development of accessible applications through the use of special properties
Totaling	Note that aggregation is available only for the SAP List Viewer Integration.

Example of the Visual Display

Table Details

Runtime class:

CL_WD_TABLE

Properties in View Designer

Name	Type	Initial Value	Bindable
id	STRING	(automatic)	No
accessibilityDescription	Translatable text		Yes
activateAccessKey	WDY_BOOLEAN	false	No
cellStyleClassNames	WDR_CELL_STYLE_CLASS_NAMES		Yes
columnResizeMode	WDUI_TABLE_COLUMN_RESIZE_MODE	preserveTableWidth	No
contextMenuBehaviour	WDUI_CONTEXT_MENU_BEHAVIOUR	inherit	No
contextMenuId	WDY_MD_UI_ELEMENT_REFERENCE		No
dataSource	Context Node		Mandatory
defaultButtonId	WDY_MD_UI_ELEMENT_REFERENCE		Yes
design	WDUI_TABLE_DESIGN	standard	Yes
displayEmptyRows	WDY_BOOLEAN	true	Yes
dropOnRowName	STRING		Yes
emptyTableText	Translatable text		Yes
enabled	WDY_BOOLEAN	true	Yes
firstActualRow	I	0	Yes
firstVisibleRow	I	0	Yes
firstVisibleScrollableCol	STRING		Yes
fixedTableLayout	WDY_BOOLEAN	false	Yes
footerVisible	WDY_BOOLEAN	true	Yes
gridMode	WDUI_TABLE_GRID_MODE	both	Yes
handleHotkeys	WDY_BOOLEAN	false	No
legendId	WDY_MD_UI_ELEMENT_REFERENCE		Yes
multiColSorting	WDY_BOOLEAN	false	Yes
readOnly	WDY_BOOLEAN	false	Yes
rowCount	I	-1	Yes
rowSelectable	WDY_BOOLEAN	true	Yes
scrollableColCount	I	-1	Yes
selectedPopin	STRING		Yes
selectionChangeBehaviour	WDUI_TABLE_SEL_CHNG_BEHVR	auto	No
selectionColumnDesign	WDUI_TABLE_SEL_COL_DESIGN	default	Yes
selectionMode	WDUI_TSMODE	auto	Yes
styleClassName	STRING		Yes
tooltip	Translatable text		Yes
visible	WDUI_VISIBILITY	visible	Yes
visibleRowCount	I	5	Yes
width	STRING		Yes

Aggregations in the View Designer

Name	Cardinality	Type
Table Column	0..n	TableColumn
DRAG_SOURCE_INFO	0..1	DragSourceInfo
DROP_ROW_TRG_INFS	0..n	DropTargetInfo
DROP_TARGET_INFO	0..1	DropTargetInfo
Group Column	0..n	AbstractTableColumn
Header	0..1	Caption
Legend Popin	0..1	Popin
Master Column	0..1	AbstractMasterTableColumn
Table Popin	0..1	TablePopin
Row Arrangement	0..1	TableRowArrangement
SCROLL_TIP_PROVIDER	0..1	TableScrollTipProvider
SEL_MENU_CFG	0..1	TableSelectionMenuConfiguration
Toolbar	0..1	ToolBar

Events in View Designer

Name
onColSelect
onCustomFilter
onDrop
onFilter
onLeadSelect
onScroll
onSelect
onSort

Dynamic Programming

For dynamic programming, the same properties, events, and aggregations as in the View Designer are available. But note that the spelling format and use of upper/lower case is different.

Dynamic Programming of Properties

View Designer Name	Runtime Name	Type
accessibilityDescription	ACCESSIBILITY_DESCR	WDY_MD_TRANSLATABLE_TEXT
activateAccessKey	ACTIVATE_ACCESS_KEY	WDY_BOOLEAN
cellStyleClassNames	CELL_STYLE_CLASS_NAMES	WDR_CELL_STYLE_CLASS_NAMES
columnResizeMode	COLUMN_RESIZE_MODE	WDUI_TABLE_COLUMN_RESIZE_MODE
columnResizeMode: preserveOtherColumnWidths	CL_WD_TABLE=>E_COLUMN_RESIZE_MODE-PRESERVE_OTHER_COLUMN_WIDTHS
columnResizeMode: preserveTableWidth	CL_WD_TABLE=>E_COLUMN_RESIZE_MODE-PRESERVE_TABLE_WIDTH
contextMenuBehaviour	CONTEXT_MENU_BEHAVIOUR	WDUI_CONTEXT_MENU_BEHAVIOUR
contextMenuBehaviour: inherit	CL_WD_TABLE=>E_CONTEXT_MENU_BEHAVIOUR-INHERIT
contextMenuBehaviour: provide	CL_WD_TABLE=>E_CONTEXT_MENU_BEHAVIOUR-PROVIDE
contextMenuBehaviour: suppress	CL_WD_TABLE=>E_CONTEXT_MENU_BEHAVIOUR-SUPPRESS
contextMenuId	CONTEXT_MENU_ID	WDY_MD_UI_ELEMENT_REFERENCE
dataSource	DATA_SOURCE	OBJECT
defaultButtonId	DEFAULT_BUTTON_ID	WDY_MD_UI_ELEMENT_REFERENCE
design	DESIGN	WDUI_TABLE_DESIGN
design: alternating	CL_WD_TABLE=>E_DESIGN-ALTERNATING
design: standard	CL_WD_TABLE=>E_DESIGN-STANDARD
design: transparent	CL_WD_TABLE=>E_DESIGN-TRANSPARENT
design: transparentWithGrid	CL_WD_TABLE=>E_DESIGN-TRANSPARENT_WITH_GRID
displayEmptyRows	DISPLAY_EMPTY_ROWS	WDY_BOOLEAN
dropOnRowName	DROP_ON_ROW_NAME	STRING
emptyTableText	EMPTY_TABLE_TEXT	WDY_MD_TRANSLATABLE_TEXT
enabled	ENABLED	WDY_BOOLEAN
firstActualRow	FIRST_ACTUAL_ROW	I
firstVisibleRow	FIRST_VISIBLE_ROW	I
firstVisibleScrollableCol	FIRST_VISIBLE_SCROLL_COL	STRING
fixedTableLayout	FIXED_TABLE_LAYOUT	WDY_BOOLEAN
footerVisible	FOOTER_VISIBLE	WDY_BOOLEAN
gridMode	GRID_MODE	WDUI_TABLE_GRID_MODE
gridMode: both	CL_WD_TABLE=>E_GRID_MODE-BOTH
gridMode: horizontal	CL_WD_TABLE=>E_GRID_MODE-HORIZONTAL
gridMode: none	CL_WD_TABLE=>E_GRID_MODE-NONE
gridMode: vertical	CL_WD_TABLE=>E_GRID_MODE-VERTICAL
handleHotkeys	HANDLE_HOTKEYS	WDY_BOOLEAN
legendId	LEGEND_ID	WDY_MD_UI_ELEMENT_REFERENCE
multiColSorting	MULTI_COL_SORTING	WDY_BOOLEAN
readOnly	READ_ONLY	WDY_BOOLEAN
rowCount	ROW_COUNT	I
rowSelectable	ROW_SELECTABLE	WDY_BOOLEAN
scrollableColCount	SCROLLABLE_COL_COUNT	I
selectedPopin	SELECTED_POPIN	STRING
selectionChangeBehaviour	SELECTION_CHANGE_BEHAVIOUR	WDUI_TABLE_SEL_CHNG_BEHVR
selectionChangeBehaviour: auto	CL_WD_TABLE=>E_SELECTION_CHANGE_BEHAVIOUR-AUTO
selectionChangeBehaviour: ifNoLoss	CL_WD_TABLE=>E_SELECTION_CHANGE_BEHAVIOUR-IF_NO_LOSS
selectionChangeBehaviour: manual	CL_WD_TABLE=>E_SELECTION_CHANGE_BEHAVIOUR-MANUAL
selectionColumnDesign	SELECTION_COLUMN_DESIGN	WDUI_TABLE_SEL_COL_DESIGN
selectionColumnDesign: default	CL_WD_TABLE=>E_SELECTION_COLUMN_DESIGN-DEFAULT
selectionColumnDesign: none	CL_WD_TABLE=>E_SELECTION_COLUMN_DESIGN-NONE
selectionColumnDesign: standard	CL_WD_TABLE=>E_SELECTION_COLUMN_DESIGN-STANDARD
selectionColumnDesign: toggle	CL_WD_TABLE=>E_SELECTION_COLUMN_DESIGN-TOGGLE
selectionMode	SELECTION_MODE	WDUI_TSMODE
selectionMode: auto	CL_WD_TABLE=>E_SELECTION_MODE-AUTO
selectionMode: multi	CL_WD_TABLE=>E_SELECTION_MODE-MULTI
selectionMode: multiNoLead	CL_WD_TABLE=>E_SELECTION_MODE-MULTI_NO_LEAD
selectionMode: none	CL_WD_TABLE=>E_SELECTION_MODE-NONE
selectionMode: single	CL_WD_TABLE=>E_SELECTION_MODE-SINGLE
selectionMode: singleNoLead	CL_WD_TABLE=>E_SELECTION_MODE-SINGLE_NO_LEAD
styleClassName	STYLE_CLASS_NAME	STRING
tooltip	TOOLTIP	WDY_MD_TRANSLATABLE_TEXT
visible	VISIBLE	WDUI_VISIBILITY
visible: none	CL_WD_TABLE=>E_VISIBLE-NONE
visible: visible	CL_WD_TABLE=>E_VISIBLE-VISIBLE
visibleRowCount	VISIBLE_ROW_COUNT	I
width	WIDTH	STRING

Dynamic Programming of Events

View Designer Name	Runtime Name
onColSelect	ON_COL_SELECT
onCustomFilter	ON_CUSTOM_FILTER
onDrop	ON_DROP
onFilter	ON_FILTER
onLeadSelect	ON_LEAD_SELECT
onScroll	ON_SCROLL
onSelect	ON_SELECT
onSort	ON_SORT

Dynamic Programming of Aggregations

View Designer Name	Runtime Name	Cardinality
Table Column	COLUMNS	0..n
DRAG_SOURCE_INFO	DRAG_SOURCE_INFO	0..1
DROP_ROW_TRG_INFS	DROP_ROW_TRG_INFS	0..n
DROP_TARGET_INFO	DROP_TARGET_INFO	0..1
Group Column	GROUPED_COLUMNS	0..n
Header	HEADER	0..1
Legend Popin	LEGEND_POPIN	0..1
Master Column	MASTER_COLUMN	0..1
Table Popin	POPIN	0..1
Row Arrangement	ROW_ARRANGEMENT	0..1
SCROLL_TIP_PROVIDER	SCROLL_TIP_PROVIDER	0..1
SEL_MENU_CFG	SEL_MENU_CFG	0..1
Toolbar	TOOLBAR	0..1

Example

You can find examples of this UI element in the system:

Web Dynpro Application WDR_TEST_UI_ELEMENTS
WDR_TEST_EVENTS component in the Table view
WDR_TEST_TABLE component
WDR_TEST_TABLE_BTC component if WDUIGUIDELINE=GL20
DEMO_TABLE component