Purpose:
Demonstrate the scenario of hiding view UI elements and aligning the elements in view layout dynamically by using recursive search
Scenario:
If we need to hide some view ui elements from layout dynamically, there is always the issue with the alignement of view ui elements.
In many of our applications, we need to have may UI element containers nested and deeply structured. Hence if we need to get one ui element by its ID dynamically, it is required to search in all available containers in the view layout. Hence, to search/ find the ui elements at any level, the recursive logic makes it so simple.
So, here I would like to explain the procedure to hide view ui elements and auto align them in view layout dynamically using recursive method call.
Key factor :
If we just set the visibility property of ui element to NONE, the element is hidden but the layout space still exists.
Hence we need to remove the element from view layout to make space for the following element.
Problem: We cannot get the removed element back again if we need to make it visible because its no more in the layout
Solution: We need to reset the view and build the view tree hierarchy by using standard view method VIEW->RESET_VIEW( )
Pre-requisite:
Basic knowledge of Webdynpro ABAP & OO ABAP
Step by Step Process:
Step1:
Create the WDA component by using T-Code SE80, and give the details as below and save the data.
Step 2:
Go to the context tab of view V_MAIN and create the context node FIELDS ( using table PA0001 ) and a context attribute HIDDEN_FIELD of type STRING as below
Step 3:
Create the view layout as below
Step 4:
Create a method SET_VISIBILITY( ) with parameters ID_FIELD_TO_BE_HIDDEN & IO_CONTAINER as below
Add the below code into SET_VISIBILITY( )
| SET_VISIBILITY |
|---|
METHOD set_visibility .
DATA lo_container TYPE REF TO cl_wd_uielement_container.
DATA lo_view_elm TYPE REF TO cl_wd_view_element.
DATA lt_children TYPE cl_wd_uielement=>tt_uielement.
DATA lo_wdr_view_elm TYPE REF TO cl_wdr_view_element.
DATA lo_layout_data TYPE REF TO cl_wd_layout_data.
DATA lb_set_layout_data TYPE wdy_boolean.
FIELD-SYMBOLS: <fs_element> TYPE REF TO cl_wd_uielement.
CLEAR lb_set_layout_data.
FREE lo_layout_data.
"======================================
" Return if nothing to do
"======================================
IF id_field_to_be_hidden IS INITIAL OR
io_container IS NOT BOUND.
RETURN.
ENDIF.
"======================================
" Get the children of the given container
"======================================
CLEAR lt_children.
lt_children = io_container->get_children( ).
LOOP AT lt_children ASSIGNING <fs_element>.
IF <fs_element>->id CS id_field_to_be_hidden.
" Get the layout data of the first field to be hidden
IF lo_layout_data IS NOT BOUND AND
lb_set_layout_data EQ abap_false.
lo_layout_data = <fs_element>->get_layout_data( ).
lb_set_layout_data = abap_true.
ENDIF.
" Remove the element from the container
io_container->remove_child(
EXPORTING
id = <fs_element>->id
).
ELSE.
" make the ui element visible
<fs_element>->set_visible( cl_wd_uielement=>e_visible-visible ).
" Check if layout data needs to be set ?
IF lb_set_layout_data EQ abap_true AND lo_layout_data IS BOUND.
" Set the layout data of first removed ui elment
<fs_element>->set_layout_data( lo_layout_data ).
FREE lo_layout_data.
CLEAR lb_set_layout_data.
ENDIF.
"Is the ui element container?
lo_view_elm ?= <fs_element>.
IF lo_view_elm->_is_ui_element_container EQ abap_true.
lo_container ?= <fs_element>.
ENDIF.
" Is container has any children ?
IF lo_container IS BOUND AND
lo_container->has_children( ) EQ abap_true.
"======================================
" Recursive call for handling children
"======================================
CALL METHOD wd_this->set_visibility(
EXPORTING
id_field_to_be_hidden = id_field_to_be_hidden
io_container = lo_container
).
ENDIF.
ENDIF.
ENDLOOP.
ENDMETHOD.
|
Step 5:
Add the below code in WDDOMODIFYVIEW( )
| WDDOMODIFYVIEW |
|---|
METHOD wddomodifyview .
DATA lv_hidden_fld TYPE wd_this->element_context-hidden_field.
DATA lo_container TYPE REF TO cl_wd_uielement_container.
FIELD-SYMBOLS: <fs_ui_element> TYPE REF TO cl_wd_uielement.
CHECK FIRST_TIME = ABAP_FALSE.
"======================================
" get the name of field to be hidden from the context
"======================================
wd_context->get_attribute(
EXPORTING
name = 'HIDDEN_FIELD'
IMPORTING
value = lv_hidden_fld ).
TRANSLATE lv_hidden_fld TO UPPER CASE.
"======================================
" Rebuild/ reset the view layout
"======================================
view->reset_view( ).
"======================================
" Get the root ui element container ref.
"======================================
FREE lo_container.
lo_container ?= view->get_root_element( ).
"======================================
"set the visibility property of the given ui element
"======================================
CALL METHOD wd_this->set_visibility
EXPORTING
id_field_to_be_hidden = lv_hidden_fld
io_container = lo_container.
ENDMETHOD.
|
Output:
Initial output :
Now, we are going to hide the field "Personnel No." as below
Final out put after hiding the field "Personnel No." and End Date takes its position
Hope this helps for those who are looking for handling view ui elements & its layout dynamically.
Comments/suggestions are always welcome
