Supply Function Method Usage in Web Dynpro Application

Applies to:
SAP ECC 6 and above.

Summary:
This document will help in learning the Supply Function Method usage in Web Dynpro Application. This will explain its usage with one simple application in easy steps Author: Vineethkumar Yogimath

Company: Infosys Created on: 29 September 2010

Author Bio
Vineethkumar Yogimath is working with Infosys for the past 2 years in SAP ABAP technology. His experience is in SAP with variety of work in ABAP. Mainly on Reports, FMs, Interfaces, BAPIs, SAP Scripts, performance analysis etc. As a part of small development he also learned WebDynpro.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

Table of Contents
Background ......................................................................................................................................................... 3 Introduction ......................................................................................................................................................... 3 Creating a Web Dynpro ABAP Application that Demonstrate the Supply Function Method ............................. 4 Steps: .............................................................................................................................................................. 4 Related Content ................................................................................................................................................ 21 Disclaimer and Liability Notice .......................................................................................................................... 22

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

Background
Before going to the main objective of this document to show the usage of Supply Function method in WebDynpro application, we need to understand some of the properties which are useful in using the Supply Function method. Cardinality Property of context node: This property defines the context node, number of elements of this node available at runtime. The first part gives minimum number of elements and second part gives the maximum number of elements that a node can contain 1..1: only one element. 0..1: at maximum one element at runtime. 1..n: n number of elements can be there, but one should be there . 0..n: n number of elements can be there with no condition of one should be there. Singleton Property: It is the one, which affects the relationship between child node and parent node. The contents of the child node are changed every time, as and when the lead selection in the parent node changes. So the Singleton child node must be repopulated every time. For each newly created context node, lead selection is initialized automatically, but this setting can also be deactivated. However, lead selection must generally be initialized for every context node. An important difference of singleton node with non singleton node is , when the node is declared as singleton there will be only one instance of the node irrespective of the number of elements found in the parent nodes collection. This is not case in non singleton node. The latter takes as many instances as there are number of elements in the parent nodes element collection. The WebDynpro programming model provides the concept of Supply Functions to fill the context nodes at runtime, which can be defined by assigning a method name to the node property Supply Function in the controller at design time. Supply Function is usually called when the context node is not filled yet or the context node has been invalidated in previous step. Supply function and context node have 1..1 relationship. i.e., they are specific to individual context nodes.

Introduction
Supply Function: Thus they are used to repopulate child nodes when the lead selection in the parent node changes. Points on Supply Function: 1) It is used to populate entire node collection. 2) It should not be used to manipulate an existing node collection. 3) Any context node can have supply function defined for it. 4) The existence of a supply function is defined declaratively. 5) It is called automatically by the Web Dynpro Runtime when an attempt is made to read an empty node collection. This situation occurs for following condition. The node is never populated before. The lead selection of the parent node is changed. Application coding has explicitly invalidated the element collection.
Note: The Supply Function of the node should never access any context node that is also populated by Supply Function .Otherwise it will cause runtime exception.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

Creating a Web Dynpro ABAP Application that Demonstrate the Supply Function Method
In this application, the header details are selected from VBAK table and displayed in ALV for the inputs given by the user for the two fields VKORG (Sales Organisation) and AUART (Document type). The Supply function method populates the corresponding Item details in ALV table when user selects a record of the displayed header table. Below are the steps to meet the objective of this document of using Supply Function method in WebDynpro Application in the case of user selecting the lead selection of parent node. Steps: 1) Go to transaction SE80 and create the new WebDynpro Application by selecting it in the drop down list.

2)

Double click on the COMPONENT CONTROLLER, to create context nodes/attributes, which are used in anywhere in the WebDynpro Application.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

3)

Create a node/attribute as shown below.

4)

A pop up will display on the screen, fill the attribute name (VKORG), type and then click on Additional Attribute to add another attribute AUART. These two attributes will be used as inputs provided by the user.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

5)

In a similar way, create the node HEADER and fill the dictionary name and other properties. Click on the Add Attribute from Structure.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

6) Select few fields from VBAK structure, which are attributes of the node HEADER.

7) Create a node ITEM under node HEADER as shown below where the HEADER is the source of supply for the node ITEM.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

8) Fill the details for node ITEM and choose few fields from the VBAP structure similarly as we did for node. In our case, the supply function method is get_itemdata.

After that screen looks like as below.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

9) The next step is to create a view. In our case we make use of default MAIN view. Go to the context tab.

10) In this step context mapping happens. Map the specific context nodes from COMPONENT CONTROLLER with the view context. Just drag and drop from the right side to the left side view context or right click on the view context and choose Copy Nodes of Different Context.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

11) In the pop up display, choose controller name using F4 help and set the context elements to be copied as shown below.

12) Go to the LAYOUT tab and right click on the ROOTELEMENTCONTAINER and click insert element.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

13) A pop up will appear, fill the details for first input field VKORG.

14) Create on the similar line the second input field AUART and captions for both these input fields. 15) Then create a button for action and in the properties of the button, type on the TEXT property to get caption.

In the properties, click on the create button of the EVENT property. Fill the details in the pop up display.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

16) Create the element for HEADER with type as TABLE.

Create the binding for the fields in the HEADER table with context node HEADER.

SAP COMMUNITY NETWORK 2010 SAP AG

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

Supply Function Method Usage in Web Dynpro Application

17) Similarly repeat the steps for binding the ITEM node with the view.

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 13

Supply Function Method Usage in Web Dynpro Application

18) After saving the MAIN view, click on the component name and add the ALV component ALV_TAB as shown.

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 14

Supply Function Method Usage in Web Dynpro Application

19) Now go to the CONTROLLER USUAGE and then INTERFACECONTROLLER_USUAGE.

20) Click on the CONTROLLER USUAGE button and drag & drop the HEADER node into the DATA node to create mapping with ALV component added.

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 15

Supply Function Method Usage in Web Dynpro Application

21) Now click on the WINDOWS and here the step is to embed the Table view of the ALV_TABLE over the View.

22) Then choose the ALV_TAB component after clicking on the F4 help for View TO BE Embedded.

23) After saving, create the application and enter the details as shown below.

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 16

Supply Function Method Usage in Web Dynpro Application

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 17

Supply Function Method Usage in Web Dynpro Application

24) Coding for the methods, which are created.

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 18

Supply Function Method Usage in Web Dynpro Application

Code for Supply function method.

The parent_element is a reference to the lead selection element of the parent node. When user selects any different element , the value of the parent_element changes . The Supply function is called to fill new elements into the table Item based on the selected element from the Header table. 25) Activate the whole application if there are no errors. Check the output below for the input given. The Header table is bounded to context node HEADER, and item table to the node ITEM. When the user inputs and clicks on Fetchdata, the method Onactiongetdata fills the header node from the VBAK table. The lead selection of the context node has been created on the first element of the node. All the line items for the Sales Document selected are populated on the second table Item from the table VBAP. This is done by the Supply function get_itemdata.

When the user selects another record from the HEADER table. The content of the Item table changes automatically.

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 19

Supply Function Method Usage in Web Dynpro Application

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 20

Supply Function Method Usage in Web Dynpro Application

Related Content
sap.sdn.com help.sap.com saptechnical.com

SAP COMMUNITY NETWORK 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 21

Supply Function Method Usage in Web Dynpro Application

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 2010 SAP AG

SDN - sdn.sap.com | BPX - bpx.sap.com | BOC - boc.sap.com | UAC - uac.sap.com 22