Sorting in Tables

WDUIGUIDELINE=GL11

You can specify that users can sort a Table or individual columns ( TableColumn ). The following conditions must be met:

• The Table must be enabled ( Table.enabled = TRUE)

• The Table action Table.onSort must be activated (it must have an action handler)

• Table columns can be sorted provided property TableColumn.sortState is set to none, up or down (not set to notSortable).

If the user clicks on the header of the table column, property TableColumn.sortState is set to down or up, and the action handler for Table.onSort is executed. The sort sequence is then changed when you click the sort icon in the column header (  none  up  down  none  ... ). When you do so, the sort sequence of other Table columns that can be sorted is reset to none.

Event Table.onSort has the event parameters listed under Table Events.

The actual sorting must be done by the application itself. In simple cases, the application can use the method handler and the IF_WD_TABLE_METHOD_HNDL~apply_sorting() function available there. You can find an example in the system in the DEMO_TABLE component.

If action Table.onColumnSelect has also been bound, the TableHeader divides into two areas: The one side (with the Caption) is the click area that triggers event Table.onColumnSelect. The other side is the click area that does the sorting, as described above. When the mouse hovers over the area, a white line is displayed that divides the two click areas. The cursor indicates that sorting is possible. The system contains a test example that is available in component WDR_TEST_TABLE under Cell Popin and Sorting and Filtering.

If you activate the table.multiColumnSorting property, users can carry out multiple sorting by clicking the mouse and simultaneously pressing and holding CTRL. Event parameter multiple of the onSort event is then set to X. Again, the application is responsible for actually sorting the data. Web Dynpro ABAP ALV, for example, uses this type of sorting.

WDUIGUIDELINE=GL20

The properties and events of Table in this mode function in the same way as under GL11. The only difference is that the MultiColumnSorting property and onColumnSelect event are ignored.

The main difference is the visualization. A sortable column receives a menu that is expanded when you click the column header. There are two entries here for sorting in ascending and descending order. The menu contains a further two entries if the filter function for this column is active.

As with the functions described here, the event Table.onSort is triggered and the corresponding event parameters and TableColumn.sortState are set when you select one of the sort points in the menu.

You can find example application in the system in component WDR_TEST_TABLE_BTC.