Table Popin in Webdynpro
-
Upload
sunil-dash -
Category
Documents
-
view
173 -
download
8
Transcript of Table Popin in Webdynpro
![Page 1: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/1.jpg)
Table popin in webdynproPosted by Muhammed Riyas in Web Dynpro ABAP on Apr 9, 2012 7:19:56 AM inShare
Created By : MUHAMMED RIYAS V A
Subject : TABLE POPIN
Date : 05/04/2012
Area : ABAP WEBDYNPRO
Purpose :
In this application user can display a space below the each row of the table by selecting that particular row.Desired Output :
![Page 2: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/2.jpg)
Steps :
Here I am displaying Sales Document: Header Data (VBAK) in the main table and Sales Document: Item Data (VBAP ) as table popin.
Step 1 :
Create a WebDynpro component with window ( Default ) and View ( Main )’ as shown below.
![Page 3: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/3.jpg)
Step 2 :
Create a node (VBAK) in the main with cardinality 0: n. In the node add attributes from the table VBAK and add 2 extra fields of type ‘STRING’ and ‘WDY_BOOLEAN’. Here extra fields are TABLEPOPIN and FLAG .
![Page 4: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/4.jpg)
Step 3 :
Similarly create one more node (VBAP) with attributes of VBAP table.
![Page 5: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/5.jpg)
Step 4 :
In layout of the Main view insert a ‘Table’ UI element.
Step 5 :
![Page 6: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/6.jpg)
In the table insert one column as shown below.
Step 6 :
Insert cell variant in the first column of the table by right clicking on the column. The figure shows the details.
![Page 7: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/7.jpg)
Step 7 :
In properties of cell_variant give a name to variant key. Here I am giving it as ‘KEY’.
Step 8 :
In properties of the column1, give the variant key name in the row selectedCellVariant.(the same name of the variant key)
![Page 8: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/8.jpg)
Step 9 :
Then go to the properties of the UI element table (VBAK) and bind the data source with VBAK node and selected popin with TABLEPOPIN attribute in VBAK node.
![Page 9: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/9.jpg)
Step 10 :
Insert one more column to the table and insert cell editor to that column. Bind the text of cell editor with the attribute ‘VBELN’.
![Page 10: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/10.jpg)
Step 11 :
Similarly create columns for all the attributes of the VBAK node except ‘flag’ and ‘tablepopin’ attribute. And bind the text with appropriate attributes from vbak node.
![Page 11: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/11.jpg)
Step 12 :
Insert table popin to the table (VBAK_TABLE) as shown below.
Step 13 :
In table popin insert content of type ‘TRANSPARENT CONTAINER’ as shown below.
![Page 12: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/12.jpg)
Step 14 :
In that container insert one table UI element and bind that table with VBAP node.
Step 15 :
In the properties of cell_varient ( in first column of VBAK ) create one event for ‘Ontoggle’ as shown below.
![Page 13: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/13.jpg)
Step 16 :
Write the below code in the method ‘WDDOINIT’.
method WDDOINIT .
DATA lo_nd_vbak TYPE REF TO if_wd_context_node.DATA lt_vbak TYPE wd_this->elements_vbak.lo_nd_vbak = wd_context->get_child_node( name = wd_this->wdctx_vbak ).
SELECT * from vbak into CORRESPONDING FIELDS OF TABLE lt_vbak UP TO 10 rows.
lo_nd_vbak->bind_table( new_items = lt_vbak set_initial_elements = abap_true ).
endmethod.
Step 17 :
Write the below code in method ‘ONACTIONTOGGLE’.
METHOD onactiontoggle .
DATA lo_nd_vbak TYPE REF TO if_wd_context_node.DATA lo_nd_vbap TYPE REF TO if_wd_context_node.DATA lt_vbak TYPE wd_this->elements_vbak.DATA ls_vbak TYPE wd_this->element_vbak.DATA lt_vbap TYPE wd_this->elements_vbap.DATA v_tabix TYPE sy-tabix.
lo_nd_vbak = wd_context->get_child_node(name = wd_this->wdctx_vbak ).lo_nd_vbap = wd_context->get_child_node(name = wd_this->wdctx_vbap ).
lo_nd_vbak->get_static_attributes_table(IMPORTING table = lt_vbak ).
READ TABLE lt_vbak INTO ls_vbakWITH KEY tablepopin = 'TABLEPOPIN'flag = 'X'.
IF sy-subrc EQ 0.v_tabix = sy-tabix.CLEAR: ls_vbak-flag,
![Page 14: Table Popin in Webdynpro](https://reader030.fdocuments.in/reader030/viewer/2022012304/5532f98b550346457f8b47af/html5/thumbnails/14.jpg)
ls_vbak-tablepopin.MODIFY lt_vbak FROM ls_vbakINDEX v_tabix.CLEAR v_tabix.
ENDIF.
READ TABLE lt_vbak INTO ls_vbakWITH KEY tablepopin = 'TABLEPOPIN'.
IF sy-subrc EQ 0.
v_tabix = sy-tabix.ls_vbak-flag = 'X'.MODIFY lt_vbak FROM ls_vbakINDEX v_tabix.CLEAR v_tabix.
SELECT * FROM vbap INTO CORRESPONDING FIELDS OF TABLE lt_vbapWHERE vbeln = ls_vbak-vbeln.
lo_nd_vbap->bind_table( new_items =lt_vbap set_initial_elements = abap_true ).
ENDIF.
lo_nd_vbak->bind_table( new_items =lt_vbak set_initial_elements = abap_true ).
ENDMETHOD.
Step 17 :
Create web application component and execute.