Web Dynpro Controllers

Controllers/Contexts

Types of Controllers
Three types of controller

Custom / Component controller

Each Web Dynpro component has at least one global controller the component controller (default) Custom controllers are a kind of additional global controllers to encapsulate sub function from the component controller typically to structure bigger components They do not have a visual interface

View controller
Each view has exactly one view controller, which processes the actions performed by the user in the view

Window controller
Each window has exactly one window controller. It behaves like a view controller (plugs) and is usable from other controllers (like a custom / component controller)

Common Controller Entities

Context Each controller has its own context. Root Node is already created Methods Called by Web Dynpro Framework(WDF). Processed Once during the life time of controller Instance
1.Standard hook methods when a controller instance is created wddoinit( ) when a controller instance is deleted wddoexit( ). 2.Additional methods can be defined using the Methods tab.

Common Controller Entities

Attributes Attributes not related to the value or property of UI elements can be declared using the Attributes tab. visible in all methods of this controller. 1.Standard Attributes

Special Entities of Component / Custom Controllers Events

Any event handler method of any other controller can register these events Use e.g. To invocate processing of view controller after processing component controller Additional Standard Hook Methods Processed directly before the navigation requests are processed wddobeforenavigation( ) Processed after all views of the view assembly to be sent have been processed wddopostprocessing( )

Special Entities of View Controllers

Designed to handle all aspects of data display and user interaction Navigation Plugs Outbound Plug A navigation event is raised when an outbound plug is fired. Inbound Plug event handler that can be registered to a navigation request. Actions links a client-side event (for example, pressing a button in a browser) For a action an event handler method (ONACTION<Action>) is automatically generated Additional Standard Hook Methods wddobeforeaction( ) is processed if a client event is fired in any view. View controller has a reference to the wddomodifyview( ) to allow you to manipulate component controller of its programmatically the layout of the view component: WD_COMP_CONTROLLER

Special Entities of Window Controllers

Same as of view controller except UI elements Contains structure of all the views to be displayed Navigation links defining the possible view assemblies contains outbound plugs and inbound plugs to set up cross-component navigation has a reference to the component controller of its component: WD_COMP_CONTROLLER

Has to define for UI elements which trigger events e.g. Pushbutton, Radiobutton, Checkboxes etc,

Actions for UI Element Events

Navigation Between Views

Plugs And Navigation

Problem Develop a Web Dynpro application with more than one view. On views, provide buttons to allow the user to initiate navigation to the next view. Process Task 1:Create a Web Dynpro component with a Web Dynpro window and two Web Dynpro views. 1. Create Web Dynpro component(ZWD_CNTR_##) with a main window MAIN_WINDOW. 2. Create two Web Dynpro views (INPUT_VIEW and OUTPUT_VIEW) inside wd component and embed them into window.

Exercise: Navigation between views

Context-The Heart of a Controller

The data used in the component or in the view are stored in the context. Readwrite access to this data is available using the controllers as a starting point.

Structure

Context Node:
Are arranged hierarchically and are permitted to have children Children of a node may be entities known as other nodes or attributes Metadata description declared manually or derived from a Dictionary Structure

Context Attribute:
Stores runtime data or references to runtime data Based on DDIC Types

Context Binding

Context Like a data container which holds the data The data transport between the UI Element and Context happens automatically by Binding

Label

Context Node: Properties collection The cardinality property controls the number of elements a node
may hold at runtime.
Cardinality of a Context Node 11 Only one element is instantiated. 01 At runtime, no more than one element is instantiated, but it is also possible that no element is instantiated. 1n n elements can be instantiated, but at least one element must be instantiated. 0n The number of instantiated elements of the context node can vary.

The Lead Selection Accessing/Marking of the Elements of node. Exactly One element from the collection of node element can be marked Setting The Lead Selection automatically by the Web Dynpro framework if the context node property Initialize Lead Selection is set to true. program source code. user actions related to UI elements (e.g. mark line in table view element, which is bound to the node). The Singleton Property Defines relationship between a dependent node and its parent node. Singleton Non-singleton

Context Node: Properties

Non-Singleton For every element in the parent node collection there will be a distinct instance of the child node

Context Node: Properties

Singleton Does not matter how many elements are present in the parent node there will only ever be one instance of the child node collection

Context Node: Properties

Supply Function Characteristics: Is mechanism to repopulate child nodes controller method is generated for supply function can be assigned to each context node of a controller Very Useful For singleton nodes

Context Node: Properties

Automatically called by Runtime When: The node collection is initial. The lead selection in the parent node collection is changed. The node collection is invalidated programmatically.

 Context mapping is the primary mechanism for sharing data between different controllers. Advantages: Data is automatically available to all controllers using the mapping relationship

Context Mapping

Only one copy of the data is ever maintained

Data can be mapped selectively, thus reducing the amount of data in a controllers context to the minimal set required to fulfil a task

Context Mapping: Internal Mapping

View Controller Component Controller

Context Root
FLIGHTS BOOKINGS

Context Root
FLIGHTS

BOOKINGS
Controller Usage Declaration BOOKID CUSTID CLASS PASSN CARRID CONNID FLDATE PRICE

BOOKID
CUSTID CLASS PASSN CARRID CONNID FLDATE PRICE

Web Dynpro Component

Mapped node collection Node collection of mapping origin

Exercise:Data Binding and Data Transfer

Problem Develop a Web Dynpro application with input/output fields on the views. The data the user enters on one view (a carrier ID and a connection ID) should be available as output on the next view. Task 1: Copy your solution from the previous exercise. From ZWD_CTRL_## to ZWD_COND_##) Or copy from NET310_CTRL_S componnent. Task 2: In the context of the component controller, create a context node that contains attributes for a carrier ID and a connection ID. Create the same context node in each of the two views and map the view controller contexts to the component controller context. 1. In the context of the component controller, create a context node (FLIGHTINFO) based on dictionary type SFLIGHT and with cardinality 1...1. Add two attributes from the structure components CARRID and CONNID. 2. Create the same node in the context of each view controller and map the contexts node of the view controllers to the context node FLIGHTINFO of the component controller.

Exercise: Data Binding and Data Transfer

Task 3: For both views, create input fields corresponding to the context node attributes and bind them to these attributes. 1. On the layout of the view INPUT_VIEW, create a form with reference to the context attributes CARRID and CONNID. Use the Web Dynpro Code Wizard to create the form. 2. Repeat the previous step for the view OUTPUT_VIEW. 3. Activate and test

Defining a View Layout

User Interface

UI Element Categories

User Interface

Root node is always of type TransparentContainer Called as RootUIElementContainer

Arrangement of UI Elements

Container Elements and Layout Container elements are UI elements that may have child elements Managers their children will be arranged All container elements define with Layout property how
The Layout property may have four values: 1. FlowLayout 2. RowLayout 3 MatrixLayout 4.GridLayout Adding UI Elements to the Layout Controlling UI Element Properties

Controller and Context Programming

Standard Controller Hook Methods
Each Web Dynpro controller is a separate ABAP class
There are two hook methods that exist for all controller types: 1. wddoinit( ): 2. wddoexit( ): These will only be called during lifetime of controller if implemented

 Reference to the context node should be created For each controller (<ctrl>), an interface is generated having the name IF_<ctrl>. For each node <node> of a controller context, a constant (WDCTX_<node>) is generated in this interface;

Accessing the Context Nodes

Thank You