Simple example of out of box ALV in Web Dynpro

ALV functionality in a Web Dynpro is implemented using SALV_WD_TABLE Web Dynpro component.

For this blog I am going to reuse Web Dynpro created in previous blog Adding Select Option to ABAP Web Dynpro Component. So copy web Dynpro ZPW_MAT_LIST to ZPW_MAT_LIST_ALV.

Define Used Component

Define used component at component level for WDR_SELECT_OPTIONS and name it as ALV.

In components context we have MATERIALS nodes which stores material list, map this node to DATA node of ALV component.

From the tree structure in left pane navigate to Component Usage->ALV->INTERFACECONTROLLER_USAGE. Then define Controller Usage for component controller and after that drag drop MATERIALS node to DATA node of ALV Interface controller usage. This mapping from context from Using component to used component is called external context mapping .

Define Place Holder for ALV in view

Go to view MAIN and insert a VIEWCONTAINERUIELEMENT and name it ALV_AREA. At this time I am not deleting existing TABLE, let it be there.

Now we need to embed ALV into this defined view container for this navigate to window, expand MAIN view node right click on ALV_AREA and choose Embed View option.

Follow these screen shots

Define usage in view and instantiate ALV component

Navigate to view MAIN properties tab and define component usage for ALV.

Add method CREATE_ALV, use web Dynpro code wizard to instantiate ALV component

METHOD create_alv .
DATA lo_cmp_usage TYPE REF TO if_wd_component_usage.

lo_cmp_usage = wd_this->wd_cpuse_alv( ).
IF lo_cmp_usage->has_active_component( ) IS INITIAL.
lo_cmp_usage->create_component( ).
ENDIF.
ENDMETHOD.

In view’s WDDOINIT call this method by statement

wd_this->create_alv( ).

That’s it. You have ALV and Grid both attached to same context node. You can, if you like, delete grid from UI.

Leave a Reply