Using Drop Down By Index in Table UI Element in WebDynpro ABAP

Applies to:
Enterprise portal, ECC 6.0, Web Dynpro ABAP. For more information, visit the Web Dynpro ABAP homepage.

Summary
This article would help ABAP developers, who are faced with a scenario of having a DropDownByIndex within the Table UI Element in their Web Dynpro Component. Author: Tulasi Palnati

Company: Yash Technologies Created on: 15 September 2009

Author Bio
Tulasi Palnati is an Enterprise Portal Consultant at Yash Technologies, Hyderabad-India

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 1

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

Table of Contents
Step 1: Create a WebDynpro Component ......................................................................................................... 3 Step 2: Create a Context to hold data ................................................................................................................ 3 Step 4: Create the Layout and Bind the context to UI Elements ........................................................................ 7 Step 5: Create Application and Test it ............................................................................................................... 9 Output: ............................................................................................................................................................ 9 Related Content ................................................................................................................................................ 11 Disclaimer and Liability Notice .......................................................................................................................... 12

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 2

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

Step 1: Create a WebDynpro Component

A. Create a new WebDynpro component by the name ZWD_DROPDOWN_TABLE.

Step 2: Create a Context to hold data

B. Double click on View. Go to Context Tab.

C. Create Node as Shown below.. D. Click on Add Attribute from Structure F. Select components from the structure and Click on finish.

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 3

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

G. Create another node under SPFLI node as below.

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 4

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

H. Create two attributes under the Node SFLIGHT as below.

I. Context of the view looks as below. J. Select the SFLIGHT and Double click on CARRID_DATA supply function.

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 5

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

Step 3: Code for Supply Function.

K. Copy the below code in the method CARRID_DATA. DATA: lt_carrid TYPE TABLE OF s_carr_id, ls_spfli TYPE wd_this->element_spfli, lt_spfli TYPE wd_this->elements_spfli, lt_sflight TYPE wd_this->elements_sflight, ls_sflight TYPE wd_this->element_sflight, wd_node TYPE REF TO if_wd_context_node, lr_element TYPE REF TO if_wd_context_element. SELECT DISTINCT carrid UP TO 20 ROWS FROM sflight INTO TABLE lt_carrid. *** This would create 20 blank rows in the table with only the dropdown filled with CARRID values DO 20 TIMES. APPEND ls_spfli TO lt_spfli. ENDDO. node->bind_table( new_items = lt_spfli set_initial_elements = abap_true ). LOOP AT lt_spfli INTO ls_spfli.

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 6

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

LOOP AT lt_carrid INTO ls_sflight-carrid. ls_sflight-key = sy-index. CONDENSE ls_sflight-key. APPEND ls_sflight TO lt_sflight. CLEAR ls_sflight. ENDLOOP. lr_element = node->get_element( sy-tabix ). wd_node = lr_element->get_child_node( 'SFLIGHT' ). wd_node->bind_table( lt_sflight ). ENDLOOP.

Step 4: Create the Layout and Bind the context to UI Elements

L. Double Click on view layout tab. M. Click on ROOTUIELEMENTCONTAINER create element TABLE. N. Bind SPFLI node elements to the table as below.

0. Bind the texts Property of Carrid DropdownByIndex with MAIN.SPFLI.SFLIGHT.CARRID

P. Create one action On_CARRID_SELECT.

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 7

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

Q. Go to Methods tab. Select On_carrid_select method Double click on it. R. Copy the below code and Paste it.
method ONACTIONON_CARRID_SELECT . DATA: lr_element TYPE REF TO if_wd_context_element, lv_index_table TYPE i, lv_index TYPE i, lt_sflight TYPE wd_this->elements_sflight, ls_sflight TYPE wd_this->element_sflight, wd_node TYPE REF TO if_wd_context_node, ls_spfli TYPE wd_this->element_spfli. *** Get row number from which dropdown value was selected lr_element = wdevent->get_context_element( 'CONTEXT_ELEMENT' ). lv_index_table = lr_element->get_index( ). wd_node = wd_context->get_child_node( 'SPFLI' ). wd_node->set_lead_selection_index( index = lv_index_table ). *** Get the index of value within dropdown which is selected wd_node = wd_context->get_child_node( 'SPFLI' ). wd_node->set_lead_selection_index( index = lv_index_table ). lv_index = wdevent->get_int( name = 'INDEX' ). *** Fetch all the dropdown values into an internal table wd_node = wd_context->path_get_node( 'SPFLI.SFLIGHT' ). CALL METHOD wd_node->get_static_attributes_table EXPORTING from = 1 to = 2000 IMPORTING table = lt_sflight. *** Obtain the value selected in the dropdown by the user using the index obtained READ TABLE lt_sflight INTO ls_sflight INDEX lv_index. wd_node->set_attribute( EXPORTING name = 'CARRID' value = ls_sflight-carrid ). SELECT SINGLE carrid connid countryfr cityfrom airpfrom countryto cityto airpto FROM spfli INTO CORRESPONDING FIELDS OF ls_spfli WHERE carrid = ls_sflight-carrid.

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 8

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

*** Fill the fetched values into the corresponding textfields of table wd_node = wd_context->get_child_node( 'SPFLI' ). CALL METHOD wd_node->set_static_attributes EXPORTING index = lv_index_table static_attributes = ls_spfli. endmethod.

Step 5: Create Application and Test it

S. Now Create a WebDynpro Application and save and activate all. Output:

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 9

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 10

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

Related Content
E-Learning Tutorials-WebDynpro ABAP WebDynpro ABAP in SDN

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 11

Using Drop Down By Index in Table UI Element in WebDynpro ABAP

Disclaimer and Liability Notice

This document may discuss sample coding or other information that does not include SAP official interfaces and therefore is not supported by SAP. Changes made based on this information are not supported and can be overwritten during an upgrade. SAP will not be held liable for any damages caused by using or misusing the information, code or methods suggested in this document, and anyone using these methods does so at his/her own risk. SAP offers no guarantees and assumes no responsibility or liability of any type with respect to the content of this technical article or code sample, including any liability resulting from incompatibility between the content within this document and the materials and services offered by SAP. You agree that you will not hold, or seek to hold, SAP responsible or liable with respect to the content of this document.

SAP COMMUNITY NETWORK 2009 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com 12