Select Options and Alv Table

Prepared by: Sankar Gelivi Profession: SAP-ABAP Web Dynpro Mail Id:sankargelivi@gmail.
com
Component Usages: ALV TABLE and

SELECT-OPTIONS:
Purpose: Importance of component Usages i.e., reusability.
Summary: This document explains, how to create or call existing components into web Dynpro
component using component usages.
Requirement: Create a component with a view and a window, on action of a button; retrieve
data from DB table based on select-options (input entered) into ALV table.
1. Go to TCode: SE80.
2. Select the Webdynpro application from the Drop down list as shown below.
Enter the name of the Webdynpro Application and click the Specs button after it to create a New
Webdypro Application
Prepared by: Sankar Gelivi Profession: SAP-ABAP Web Dynpro Mail Id:sankargelivi@gmail.com
3. Click on button ‘YES’
4. Select the Webdynpro Component Radio button and provide the Description to create an application.
Create a component with view and window as shown below. By default program name will be
assigned as name of the window, if required we can change the name of the window.
5. Enter name of the components under Component column as shown below and under the
Component Use enter the default name to identify the Component Used.
6. Go to the View Controller and click on Create Controller Usage (Icon of Create) as shown below
7. Select SALV_WD_TABLE and press enter
8. Select WDR_SELECT_OPTIONS and press enter

9. Finally you see in the below screen the Components Used under the Component Usages.
10. Go the Component controllerContext and create a node ‘ALVTABLE’ with Attributes as shown
below
11. Go to the View controller Context, drag and drop the Node from Component Controller context
12. Go to the View controller Attributes tab and enter the attributes M_WD_SEL_OPTIONS and
M_HANDLER under Attributes column and their types as shown below
13. Go to View Layout and design the screen with two View Container UI element and a button
14. Right click on ROOTUIELEMENTCONTAINERInsert Element
15. Enter ID: Description to UI element and Typ : Select UI element from the Pick list
16. Observe in the below screen ViewContainer is created under ROOTUIELEMENTCONTAINER

17. Right click on ROOTUIELEMENTCONTAINERInsert Element and Enter ID: Description to UI

element and Typ : Select UI element from the Pick list
18. Observe in the below screen ViewContainer for Select Options is created under
ROOTUIELEMENTCONTAINER
19. Repeat the same process to create Button

20. Observe in the below screen, View is designed with two view containers and a button
Implement the following code in WDDOINIT Method.

METHOD wddoinit .
DATA lo_cmp_usage TYPE REF TO if_wd_component_usage.
lo_cmp_usage = wd_this->wd_cpuse_sel_option( ).
IF lo_cmp_usage->has_active_component( ) IS INITIAL.
lo_cmp_usage->create_component( ).
ENDIF.
wd_this->m_wd_sel_option = wd_this->wd_cpifc_sel_option( ).
wd_this->m_handler = wd_this->m_wd_sel_option->init_selection_screen( ).
DATA : it_range_table TYPE REF TO data,
c_empno TYPE string VALUE 'YSG_EMPNO'.
it_range_table = wd_this->m_handler->create_range_table( i_typename = c_empn
o ).
CALL METHOD wd_this->m_handler->add_selection_field(
EXPORTING
i_id = c_empno
it_result = it_range_table ).
CALL METHOD wd_this->m_handler->set_global_options
EXPORTING
i_display_btn_cancel = abap_false
i_display_btn_check = abap_false
i_display_btn_reset = abap_false
i_display_btn_execute = abap_false.
ENDMETHOD.
Implement the following code in OnactionSearch.

METHOD onactionsearch .
FIELD-SYMBOLS : <data> TYPE ANY TABLE.
DATA : lv_emp TYPE REF TO data,
m_handler TYPE REF TO if_wd_select_options,
it_emp TYPE STANDARD TABLE OF ysg_demo,
lo_nd_tab TYPE REF TO if_wd_context_node,
lo_el_tab TYPE REF TO if_wd_context_element.
CALL METHOD wd_this->m_handler->get_range_table_of_sel_field
EXPORTING
i_id = 'YSG_EMPNO'
RECEIVING
rt_range_table = lv_emp.
ASSIGN lv_emp->* TO <data>.
SELECT * FROM ysg_demo INTO TABLE it_emp WHERE empno IN <data>.
lo_nd_tab = wd_context->get_child_node( 'TABLE' ).
lo_nd_tab->bind_table( it_emp ).
ENDMETHOD.
21. Double click on the interface controller and create controller usage as shown below(Icon of
create)
22. Select component YSG_SELECT_OPTIONS as shown below

23. Drag and drop ALVTABLE node on to DATA Node of Interface controller context
24. Go to Windows and right click on container and click on Embed View
25. Click on f4 help of View to be Embedded and select SALV_WD_TABLE /TABLE as shown below
26. Go to Windows and right click on container and click on Embed View
27. Click on f4 help of View to be Embedded and select WDR_SELECT_OPTIONS as shown below
28. Finally we can see the Containers and assigned component usages to the containers
29. Right click on the componentCreateWeb Dynpro Application

30. By default Application name will be your component name and enter the description
31. Observe in the below screen, an URL is generated with respect to your component. This is called
as Fully Qualified Domain Name
32.Save and Active the Component and Test the Application
Output:
Result:

Select Options and Alv Table

Diunggah oleh

Informasi Dokumen

Deskripsi Asli:

Judul Asli

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Select Options and Alv Table

Diunggah oleh

Hak Cipta:

Format Tersedia

Prepared by: Sankar Gelivi Profession: SAP-ABAP Web Dynpro Mail Id:sankargelivi@gmail.

Component Usages: ALV TABLE and

3. Click on button ‘YES’

7. Select SALV_WD_TABLE and press enter

8. Select WDR_SELECT_OPTIONS and press enter

16. Observe in the below screen ViewContainer is created under ROOTUIELEMENTCONTAINER

17. Right click on ROOTUIELEMENTCONTAINERInsert Element and Enter ID: Description to UI

19. Repeat the same process to create Button

Implement the following code in WDDOINIT Method.

Implement the following code in OnactionSearch.

22. Select component YSG_SELECT_OPTIONS as shown below

29. Right click on the componentCreateWeb Dynpro Application

32.Save and Active the Component and Test the Application

Anda mungkin juga menyukai