Description
I was facing issues in creating a table with Cell Variant at runtime, after some trial and errors I was able to add cell variants in the table dynamically. The table contains a column, cell of this column can have a dropdown or a TextView depending on the variant key passed in code. Hope this code will help you also.
Step 1: Create a table by using “NEW_TABLE” method of class CL_WD_TABLE. This table has 5 rows and is bound to context node “CN_TABLE”.
Data: lo_table TYPE REF TO cl_wd_table. lo_table = cl_wd_table=>new_table( id ='TBL_TABLE' bind_data_source ='CN_TABLE' design = cl_wd_table=>e_design-alternating visible_row_count = 5 ). cl_wd_flow_data=>new_flow_data( EXPORTING element = lo_table RECEIVING control = lo_flow_data ).
Step 2: You can give the table header using SET_HEADER method of class CL_WD_TABLE.
lo_table_header ?= cl_wd_caption=>new_caption( text = 'Table UI element - example' ). * Set Header of the Table. lo_table->set_header( lo_table_header ).
Step 3: Add the table into the root UI element container.
lo_ele_container->add_child( EXPORTING the_child = lo_table ).
Step 4: Once the table is added into the container, it is time to add the column into this table. Below is the code for creating new table column:
Data: lo_column_name TYPE REF TO cl_wd_table_column. lo_column_name = cl_wd_table_column=>new_table_column( id = 'TBL_EXAMPLE_NAME' ).
Step 5: You can set the header of the column using SET_HEADER method of class CL_WD_TABLE_COLUMN.
lo_column_name_header ?= cl_wd_caption=>new_caption( text = 'Name' ). lo_column_name->set_header( lo_column_name_header ).
Step 6: Now we will have to create two standard cell, first standard cell will contain a TextView, while the other standard cell will contain a dropdown. Variant key for first cell will be ‘NAPPL’ and for other cell variant key will be ‘SELECT’.
Data: lo_std_cell1_table TYPE REF TO cl_wd_table_standard_cell, lo_std_cell2_table TYPE REF TO cl_wd_table_standard_cell. cl_wd_table_standard_cell=>new_table_standard_cell( RECEIVING control = lo_std_cell1_table ). cl_wd_table_standard_cell=>new_table_standard_cell( RECEIVING control = lo_std_cell2_table ). lo_std_cell1_table->set_variant_key( value = 'NAPPL' ). lo_std_cell2_table->set_variant_key( value = 'SELECT' ).
Step 7: Once both standard cells are created, these needs to be assigned to the table column. Method “ADD_CELL_VARIANT” is used for the same.
lo_column_name->add_cell_variant( the_cell_variant = lo_std_cell1_table ). lo_column_name->add_cell_variant( the_cell_variant = lo_std_cell2_table ).
Step 8: Once cell variants are added to the column, it’s time to create cell editors and bind them to standard table cells.
lo_text_view = cl_wd_text_view=>new_text_view( id ='TBL_EDIT_NAME' bind_text ='CN_TABLE.NAME' ). lo_std_cell1_table->set_editor( lo_text_view ). lo_drop_down = cl_wd_dropdown_by_key=>new_dropdown_by_key( bind_selected_key = 'CN_TABLE.NAME' ). lo_std_cell2_table->set_editor( lo_drop_down ).
Step 9: Bind the Cell Variant property of the column to context node, so that it can select the variant according to the data passed.
lo_column_name->bind_selected_cell_variant( path = 'CN_TABLE.VARIANT' ).