|
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 : |
|
|
|
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. 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 . Step 3 :
Similarly create one more node (VBAP) with attributes of VBAP table. Step 4 :
In layout of the Main view insert a ‘Table’ UI element.
Step 5 : 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.
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)
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.
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’.
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.
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.
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.
Step 16 : Write the below code in the method ‘WDDOINIT’.
method WDDOINIT . DATA lo_nd_vbak TYPE REF TO if_wd_context_node. SELECT * from vbak into CORRESPONDING FIELDS OF TABLE lt_vbak UP TO 10rows. 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. lo_nd_vbak = wd_context->get_child_node( lo_nd_vbak->get_static_attributes_table( READ TABLE lt_vbak INTO ls_vbak IF sy-subrc EQ 0. ENDIF. READ TABLE lt_vbak INTO ls_vbak IF sy-subrc EQ 0. v_tabix = sy-tabix. SELECT * FROM vbap INTO CORRESPONDING FIELDS OF TABLE lt_vbap lo_nd_vbap->bind_table( new_items = ENDIF. lo_nd_vbak->bind_table( new_items = ENDMETHOD.
Step 17 : Create web application component and execute.
|
