Web DynPro ABAP Training Material

Prepared by : Ragunathan.R Company Name : Enteg Infotech Pvt. Ltd.,

Bangalore

Enteg InfoTech Pvt. Ltd.

Contents
 What is Web Dynpro (Overview)  Concept of View  Components of View Layout
Properties Tab Context Tab Methods Tab Attributes Tab

          

Concept of Component Controller Application Displaying Messages Supply Function Cardinality Property Singleton Lead Selection Hook Methods Types of Controllers Hook Methods Chart Exercise
2

Enteg InfoTech Pvt. Ltd.

What is Web Dynpro:

 It is the SAP standard UI technology used for developing web business applications without knowing HTML or Javascript  Strict separation between the layout and business data  Reuse and better maintainability through reusability  Automatic input checks  Automatic data transport using data binding  WYSIWYG view editor

Enteg InfoTech Pvt. Ltd.

Concept of View:
 We can add different UI elements that can be nested on in the other one to create the screen  Each view has a view controller that is automatically created for this view and each view has several tabs (Properties, Layout, Outbound Plug, Inbound Plug, Attributes, Context, Actions and Methods)

Components of View Layout:

1) UI Element Library 2) View Designer 3) Context Menu 4) UI elements properties and 5) UI element Hierarchy
Enteg InfoTech Pvt. Ltd. 6-Feb-12 4

1) Properties Tab:
Here we can set the lifetime of the view 1) Framework controlled Controller by Framework 2) When Visible Lifetime limited to its visibility.

2) Context Tab:
The data are stored in the context and the UI elements are only objects the user interacts with.

3) Methods Tab:
 Event Handler Methods  Hook Methods and (wddoinit, wddoexit etc)  User-defined instance methods

Enteg InfoTech Pvt. Ltd.

6-Feb-12

4) Attributes Tab:
i) wd_context:  It is a reference to the controller context. IF_WD_CONTEXT_NODE interface provides several methods that enable us to obtain read and write access to a context node. ii) wd_this:  This is a self reference to local controller interface. We can use it to call user defined methods. iii) wd_comp_controller:  It is a reference variable of IG_COMPONENT CONTROLLER type that we can use to access all the publically accessible methods of the component global generated interface of the corresponding component controller.

Enteg InfoTech Pvt. Ltd.

6-Feb-12

Concept of Component Controller:

 Data required across different views can be stored in this context

Application:
 For the execution of the Web Dynpro Component.

Displaying Messages:
 On the properties tab of an application we can specify how the messages are handled. 1) Show Message component on demand 2) Always display message component

Enteg InfoTech Pvt. Ltd.

6-Feb-12

Supply Function:
 Each node may have a supply function defined for it and automatically called by the Web Dynpro Framework  The scope of using a supply function is to populate a context node. In certain cases , we can use the Hook Method wddoinit instead of a supply function.

Cardinality Property:
 It tells us how many elements a context node may have at runtime. (i) 1 to 1 Exactly one context element is instantiated (ii) 0 to 1 Maximum one context element is instantiated (iii) 0 to n Zero or more context element is instantiated (iv) 1 to n One or more context element is instantiated
Enteg InfoTech Pvt. Ltd. 6-Feb-12 8

Singleton:
 Unlike the Cardinality of a node which describes the number of possible elements within the node the Singleton property determines whether or not these elements are set for all the parent node (Non-Singleton) or for exactly one element of the parent node (Singleton).

Lead Selection:
 At runtime, every child set as a singleton contains elements for exactly one element of the parent node. For this purpose, one element from the set of possible elements of the parent node must be highlighted.  This is achieved by initializing lead selection. For each newly created context node, lead selection is initialized automatically.

Enteg InfoTech Pvt. Ltd.

6-Feb-12

Hook Methods:
 These methods cannot be deleted and represent the interface between the Framework and our application. The Hook Methods are called in a specific sequence according to a Phase Model.

Types of Controllers:
1) Component Controller 2) View Controller 3) Window Controller 4) Custom Controller

Enteg InfoTech Pvt. Ltd.

6-Feb-12

10

Hook Methods Chart:

Hook Methods

Component Cont.
Yes Yes Yes Yes --------Yes -----

View Cont.
Yes Yes ----Yes Yes Yes Yes -------

Window Cont.
Yes Yes ---------------Yes Yes

Custom Cont.
Yes Yes -------------------

Wddoinit() Wdddoexit() Wddobefore navigation() Wddopost processing() Wddomodifyview() Wddoafter action Wddobefore action Wddocontext ment(0 Wddoapplication statechange() Wddoonopen() Wddoonclose()

Enteg InfoTech Pvt. Ltd.

6-Feb-12

11

1) wddoinit():  This method can be considered the controller constructor. It is automatically called when the controller is initialized for the first time. 2) wddoexit():  this method can be considered as the controller destructor. It is automatically called when exiting the controller, and can be used for executing closing statements. 3) wddomodifyview():  This method is mostly used in the dynamic programming, it is a method used for modifying the view before rendering.(Dynamically modifying the view) 4)wddobeforeaction():  We can use this method to perform our own validation before an action is triggered.(Check_mandatory_attr_on_view)
Enteg InfoTech Pvt. Ltd. 6-Feb-12 12

5) wddocontextmenu():  It is used to provide the hierarchical context menus in Web Dynpro views.  We can create a context menu at design time, by using the CONTEXT_MENUS root, or dynamically, by coding the wddooncontext menu method. 6) wddoafteraction():  This method is called for all visible views at the time an action is executed.  Here functions can be placed that are carried out equally for all associated event handlers.  This avoids any unnecessary multiple programming in the event handlers.

Enteg InfoTech Pvt. Ltd.

6-Feb-12

13

7) wddoonopen() & wddoonclose()  There are two methods are only processed when a window is opened or closed as a dialog box.  Since the opening of dialog box does not involve any navigation, no inbound plug is called and therefore no event handler method is processed  The wddoonopen method can therrefore be used to implement initializations. 8) wddodobeforenavigation():  It can be used to perform an additional validation of those controller contexts that are required in the application but have not been validated in the request/response cycle yet.  This is important for more complex Web Dynpro applications in particular. This method is used for the component assigned to the phase model instance and all embedded components.
Enteg InfoTech Pvt. Ltd. 6-Feb-12 14

9) wddopostprocessing():  This method is called in the process step before rendering. Therrefore it allows you to add application specific clean-up processes. 10) Wddoapplicationstatechange():  This method replaces the WDDOEXIT method in the phase model.

Enteg InfoTech Pvt. Ltd.

6-Feb-12

15

Exercies:
1) Creating Simple Web Dynpro ABAP Application using input box, Label and Button UI Elements with overview of all UI elements 2) Using ALV Component in Web Dynpro ABAP 3) Navigation between views using Plugs

Enteg InfoTech Pvt. Ltd.

6-Feb-12

16

?
Enteg InfoTech Pvt. Ltd. 6-Feb-12 17