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.

/wp-content/uploads/2014/01/1_356979.png

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

V1.PNG

Step 3:

Create the view layout as below

V2.PNG

Step 4:

Create a method SET_VISIBILITY( ) with parameters ID_FIELD_TO_BE_HIDDEN & IO_CONTAINER as below

V3.PNG

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_visiblevisible ).


      ” 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_contexthidden_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 :

/wp-content/uploads/2014/01/o1_1_357001.png

Now, we are going to hide the field “Personnel No.” as below

/wp-content/uploads/2014/01/o1_2_357005.png

Final out put after hiding the field “Personnel No.” and End Date takes its position

o2.PNG

Hope this helps for those who are looking for handling view ui elements & its layout dynamically.

Comments/suggestions are always welcome

To report this post you need to login first.

2 Comments

You must be Logged on to comment or reply to a post.

    1. Ramakrishnappa Gangappa Post author

      Hi Chandra,

      Thanks for your comments. 🙂


      I know Mr. Kiran, has created similar document but his document do not cater for the requirement of repeated hide/visible of a field. Also, here the approach differs from that document


      Regards,

      Rama

      (0) 

Leave a Reply