Sales Data Flow Based on User Input Using FPM With Web Dynpro ABAP

SAP COMMUNITY NETWORK SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com

© 2010 SAP AG 1

Explains Sales Data Flow Based

on User Input using FPM

Framework

Applies to:

Webdynpro ABAP. For more information, visit the Web Dynpro ABAP homepage.

Summary

This document shows the sales data flow from Header to Invoice details based on User Input using FPM Framework.

Author: Tulasi Palnati

Company: Yash Technologies

Created on: 17th Aug, 2010

Author Bio

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

https://www.sdn.sap.com/irj/sdn/nw-wdabap


© 2010 SAP AG 2

Table of Contents

Step 1: Create Webdynpro Component .......................................................................................................... 3

Step 2: Create context in component controller .............................................................................................. 3

Step 3: Create views and windows ................................................................................................................. 9

Step 4: Map the context of controller to the View Header and design the layout as follows ........................ 11

Step 5: Embed the Select_options Standard component in the Used components ..................................... 12

Step 6: Map the context of controller to the View LINE_ITEM and design the layout as follows ................ 15

Step 7: Map the context of controller to the View CONDITION and design the layout as follows................ 16

Step 8: Map the context of controller to the View DELIVERIES and design the layout as follows............... 17

Step 9: Map the context of controller to the View INVOICE and design the layout as follows ..................... 18

Step 10: Embed the Standard Interface IF_FPM_BUILDING_BLOCK in our component implemented interfaces ....................................................................................................................................................... 19

Step 11: Save all and activate the Component ............................................................................................. 20

Step 12: Create Application and save it in Package. .................................................................................... 21

Step 13: Open the Package and expand the Web Dynpro applications folder............................................. 22

Step 14: Application and Component Configuration Settings to display the application using FPM ............ 23

Step 15: Process the Events of FPM in Component Controller .................................................................... 32

Step 16: Test the Application ........................................................................................................................ 35

Related Content ................................................................................................................................................ 41

Disclaimer and Liability Notice .......................................................................................................................... 42


© 2010 SAP AG 3

Step 1: Create Webdynpro Component

Step 2: Create context in component controller

Create a node VBAK with cardinality 1..n

Click on add attributes from structure.

Create node VBAP with Cardinality 1..n


© 2010 SAP AG 4

Click on add attributes from structure and select the fields in the below screen shot


© 2010 SAP AG 5

Create node KONV with Cardinality 0..n



© 2010 SAP AG 6

Create node VBFA with Cardinality 0..n



© 2010 SAP AG 7

Create node INVOICE with Cardinality 0..n and Click on OK .

Right click on INVOICE NODE and select add attributes from structure. Give structure name LIPS and select the fields in the below screen shot


© 2010 SAP AG 8

Right click on INVOICE NODE and select add attributes from structure. Give structure name LIPS and select the fields in the below screen shot


© 2010 SAP AG 9

Step 3: Create views and windows

Create 4 Views to the corresponding Windows as below:

View Window

LINE_ITEM LINE_ITEM_WIN

CONDITIONS CONDITIONS_WIN

DELIVERIES DELIVERIES_WIN

INVOICE INVOICE_WIN


© 2010 SAP AG 10


© 2010 SAP AG 11

Step 4: Map the context of controller to the View Header and design the layout as follows


© 2010 SAP AG 12

Step 5: Embed the Select_options Standard component in the Used components

Go to Component Controller and give global attribute M_HANDLER with ref to IF_WD_SELECT_OPTIONS


© 2010 SAP AG 13

Copy the below code in the WDDOINIT( ) method of component controller

method WDDOINIT .

DATA lo_cmp_usage TYPE REF TO if_wd_component_usage.

lo_cmp_usage = wd_this->wd_cpuse_select_options( ).

IF lo_cmp_usage->has_active_component( ) IS INITIAL.

lo_cmp_usage->create_component( ).

ENDIF.

DATA lo_interfacecontroller TYPE REF TO iwci_wdr_select_options .

lo_interfacecontroller = wd_this->wd_cpifc_select_options( ).

wd_this->m_handler = lo_interfacecontroller->init_selection_screen(

data:

lt_range TYPE REF TO data,

lt_range1 TYPE REF TO data.

CALL METHOD wd_this->m_handler->create_range_table

EXPORTING

i_typename = 'VKORG'

* i_length =

* i_decimals =

receiving

rt_range_table = lt_range

.

CALL METHOD wd_this->m_handler->create_range_table

EXPORTING

i_typename = 'VTWEG'

receiving

rt_range_table = lt_range1

.

CALL METHOD wd_this->m_handler->add_selection_field

EXPORTING

i_id = 'VKORG'

* i_within_block = MC_ID_MAIN_BLOCK

* i_description =

* i_is_auto_description = ABAP_TRUE

it_result = lt_range

.

CALL METHOD wd_this->m_handler->add_selection_field

EXPORTING

i_id = 'VTWEG'

* i_within_block = MC_ID_MAIN_BLOCK

* i_description =

* i_is_auto_description = ABAP_TRUE

it_result = lt_range1.

endmethod.


© 2010 SAP AG 14

Go to window and embed the Standard WIND_SELECTION_SCREEN into VIEW CONTAINER of HEADER view


© 2010 SAP AG 15

Step 6: Map the context of controller to the View LINE_ITEM and design the layout as follows


© 2010 SAP AG 16

Step 7: Map the context of controller to the View CONDITION and design the layout as follows


© 2010 SAP AG 17

Step 8: Map the context of controller to the View DELIVERIES and design the layout as follows


© 2010 SAP AG 18

Step 9: Map the context of controller to the View INVOICE and design the layout as follows


© 2010 SAP AG 19

Step 10: Embed the Standard Interface IF_FPM_BUILDING_BLOCK in our component implemented interfaces

Click on Reimplement button.


© 2010 SAP AG 20

Go and check in the component controller methods tab all the interface methods will be available .

Step 11: Save all and activate the Component


© 2010 SAP AG 21

Step 12: Create Application and save it in Package.

Give the Component name: FPM_GAF_COMPONENT

Interface View : FPM_WINDOW

Default : DEFAULT

Note: When the Application gets created it will be available in Package.


© 2010 SAP AG 22

Step 13: Open the Package and expand the Web Dynpro applications folder

Select the Webdynpro application and right click on it select create/change configuration


© 2010 SAP AG 23

Step 14: Application and Component Configuration Settings to display the application using FPM

Give configuration ID as ZSALES_APPLCONFIG

Click on Create.

New Window will be opened.

Here give the name for Component Configuration (any name):ZSALES_COMP_CONFIG

Click on Save and click on Go to Component Configuration automatically it navigates to another window.


© 2010 SAP AG 24

Click on create and new window will open and save the component configuration in the package.

New Window for configuration for particular component will open with Default RoadMap with buttons.


© 2010 SAP AG 25

Select the Main Step From Hierarchy and Properties will available in right side.

Give Mainstep ID :Header Details and Mainstep Name: Header Details

In Right Side, click on Add Main Step button automatically one more road map will be added change the Main Step id and Main Step name: Line Items


© 2010 SAP AG 26

Add few more steps same as above for Conditions View, Deliveries View and Invoice View and screenshot as follows:


© 2010 SAP AG 27

Save the Configuration and Select the Header Details Step and Click on Add Toolbar Element.

New Popup will be open. Application Specific buttons will be there.

Select the Other Function Button and click on Ok.

Repeat above process for one more Function.


© 2010 SAP AG 28

Select the buttons in the application title and Change the button properties

For 1st Button:

Give Label HEADER DETAILS and FPM Event ID HEADER

For 2nd Button:

Give Label ITEM DETAILS and FPM Event ID LINE_ITEM

Select the Line Items Step and Click on Add Toolbar Element.



Select the button in the application title and Change the button properties

Give Label Condition and FPM Event ID CONDITION


© 2010 SAP AG 29

Select the CONDITIONS Step and Click on Add Toolbar Element.




Give Label Delivery and FPM Event ID DELIVERY

Select the DELIVERIES Step and Click on Add Toolbar Element.




Give Label INVOICE and FPM Event ID INVOICE


© 2010 SAP AG 30

Save the Configuration Data.

Expand the Header Details Step from hierarchy. Select UIBB and change the properties.

Give Component Name :< Your Component Name> (here YH1168_SALES_DETAILS)

Window Name : <Window name> (here YH1168_SALES_DETAILS)

Repeat the same for all the Main Steps as follows.


© 2010 SAP AG 31


© 2010 SAP AG 32

Step 15: Process the Events of FPM in Component Controller

Go to Component controller and Double Click on Process_Event Method

Copy the below code in Process_Event Method.

Save and activate it.

method PROCESS_EVENT .

DATA lo_nd_vbak TYPE REF TO if_wd_context_node.

DATA lo_el_vbak TYPE REF TO if_wd_context_element.

DATA ls_vbak TYPE wd_this->element_vbak.

lo_nd_vbak = wd_context->get_child_node( name = wd_this->wdctx_vbak ).

lo_el_vbak = lo_nd_vbak->get_element( ).

lo_el_vbak->get_static_attributes(

IMPORTING

static_attributes = ls_vbak ).

DATA lo_nd_vbap3 TYPE REF TO if_wd_context_node.

DATA lo_el_vbap3 TYPE REF TO if_wd_context_element.

DATA ls_vbap3 TYPE wd_this->element_vbap.

lo_nd_vbap3 = wd_context->get_child_node( name = wd_this->wdctx_vbap ).

lo_el_vbap3 = lo_nd_vbap3->get_element( ).

lo_el_vbap3->get_static_attributes(

IMPORTING

static_attributes = ls_vbap3 ).

CASE io_event->mv_event_id.

WHEN 'HEADER'.

DATA :

lo_nd_vbak1 TYPE REF TO if_wd_context_node,

lt_vbak TYPE wd_this->elements_vbak,

lt_range TYPE REF TO data,

lt_range1 TYPE REF TO data,

lo_fpm TYPE REF TO if_fpm.

FIELD-SYMBOLS:


© 2010 SAP AG 33

<fs> TYPE ANY TABLE ,

<fs2> TYPE ANY TABLE.

lo_nd_vbak1 = wd_context->get_child_node( 'VBAK' ).

CALL METHOD wd_this->m_handler->get_range_table_of_sel_field

EXPORTING

i_id = 'VKORG'

receiving

rt_range_table = lt_range

.

ASSIGN lt_range->* to <fs>.

CALL METHOD wd_this->m_handler->get_range_table_of_sel_field

EXPORTING

i_id = 'VTWEG'

receiving

rt_range_table = lt_range1

.

ASSIGN lt_range1->* to <fs2>.

SELECT *

FROM vbak

into CORRESPONDING FIELDS OF TABLE lt_vbak

WHERE vkorg in <fs>

OR vtweg in <fs2>.

lo_nd_vbak1->bind_table( lt_vbak ).

WHEN 'LINE_ITEM'.

lo_fpm = cl_fpm_factory=>get_instance( ).

lo_fpm->raise_event_by_id( cl_fpm_event=>GC_EVENT_NEXT_STEP ).

DATA:

lo_nd_vbap TYPE REF TO if_wd_context_node,

lt_vbap TYPE wd_this->elements_vbap.

lo_nd_vbap = wd_context->get_child_node( 'VBAP' ).

SELECT *

FROM vbap INTO CORRESPONDING FIELDS OF TABLE lt_vbap

WHERE VBELN EQ ls_vbak-vbeln.

lo_nd_vbap->bind_table( lt_vbap ).

WHEN 'CONDITION'.

DATA :

lo_nd_konv TYPE REF TO if_wd_context_node,

lt_konv TYPE wd_this->elements_konv.

lo_nd_konv = wd_context->get_child_node( 'KONV' ).

SELECT * FROM

konv

into CORRESPONDING FIELDS OF TABLE lt_konv

WHERE knumv EQ ls_vbak-knumv

AND kposn EQ ls_vbap3-posnr.

lo_nd_konv->bind_table( lt_konv ).



WHEN 'DELIVERY'.

DATA:

lo_nd_vbfa TYPE REF TO if_wd_context_node,

lt_vbfa TYPE wd_this->elements_vbfa.

lo_nd_vbfa = wd_context->get_child_node( 'VBFA' ).

SELECT vbelv

posnv

vbeln


© 2010 SAP AG 34

posnn

rfmng

meins

FROM vbfa

INTO CORRESPONDING FIELDS OF TABLE lt_vbfa

WHERE vbelv EQ ls_vbap3-vbeln

AND posnv EQ ls_vbap3-posnr

AND vbtyp_n EQ 'J'.

lo_nd_vbfa->bind_table( lt_vbfa ).



WHEN 'INVOICE'.

DATA:

lo_nd_invoice TYPE REF TO if_wd_context_node,

lt_invoice TYPE wd_this->elements_invoice.

lo_nd_invoice = wd_context->get_child_node( 'INVOICE' ).

SELECT

vrp~vbeln

vrp~posnr

lps~vbeln

lps~posnr

FROM lips AS lps

INNER JOIN vbrp AS vrp

ON vrp~vgbel EQ lps~vbeln

AND vrp~vgpos EQ lps~posnr

INTO table lt_invoice

WHERE lps~vgbel EQ ls_vbap3-vbeln

AND lps~vgpos EQ ls_vbap3-posnr.

lo_nd_invoice->bind_table( lt_invoice ).



ENDCASE.

endmethod.


© 2010 SAP AG 35

Step 16: Test the Application

Go to Package and Expand WebDynpro Folder.

Expand the Application Configurations Folder. Select the particular application and click on Test.


© 2010 SAP AG 36

Output:

If you don’t want default buttons should display make it as invisible by opening the application in configuration mode (by adding the application path with this parameter ‘&sap-config-mode=X’ ).

Select the buttons which you don’t want to display Right click on it and select Settings for current configuration.


© 2010 SAP AG 37

Give some Selection Screen Input Sales Organization 1000 and Distribution Channel 10 to 12

.


© 2010 SAP AG 38

Select any header Details in the Table and Click on Line Items automatically it navigates to Second Screen with line Items of particular header

Select the particular Item and Click on Condition automatically it navigates to Next screen with Conditions of particular line item.


© 2010 SAP AG 39

Select the particular Item and Click on Deliveries automatically it navigates to Next screen with Deliveries of particular line item.

Select the particular delivery Item and Click on Invoice automatically it navigates to Next screen with Invoice Details particular line item.


© 2010 SAP AG 40


© 2010 SAP AG 41

Related Content

WebDynpro ABAP Wiki's

WebDynpro ABAP Homepage

For more information, visit the Web Dynpro ABAP homepage

http://wiki.sdn.sap.com/wiki/display/WDABAP/Web+Dynpro+ABAP+Home

http://www.sdn.sap.com/irj/sdn/nw-wdabap%23section2

https://www.sdn.sap.com/irj/sdn/nw-wdabap


© 2010 SAP AG 42

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.

Sales Data Flow Based on User Input Using FPM With Web Dynpro ABAP

Documents

component controller

context of controller

table of contents step

webdynpro component

sap ag

view invoice

view header

fpm framework