SDN Contribution

Screen Conversion in WebDynpro for ABAP

Applies to:
SAP NetWeaver 2004s Web Dynpro for ABAP

Summary
This tutorial provides a guide for Converting a SAP Module Pool Program Screen into a WDA View. This
tutorial assumes that you have completed WDA Tutorial I: Getting Started with Web Dynpro for ABAP and
have a good understanding of the basics of Web Dynpro for ABAP.
Author: Maheswaran Baskaran
Company: Cognizant Technology Solutions India Pvt. Ltd.
Created on: 16 August 2006

Author Bio
Maheswaran Baskaran is a Programmer Analyst for Cognizant Technology Solutions, Pvt., Ltd. based in
Tamilnadu, India. He has one year experience in the IT industry. He has good knowledge in ABAP and
JAVA.

2006 SAP AG

Table of Contents
Screen Conversion in WebDynpro for ABAP .................................................................................. 1
Applies to: ........................................................................................................................................ 1
Summary.......................................................................................................................................... 1
Author Bio ........................................................................................................................................ 1
Table of Contents ............................................................................................................................ 2
Introduction: ................................................................................................................................. 3
Screen Design Time Conversion Wizard: .................................................................................... 3
Procedure:.................................................................................................................................... 3
Screen No 1: ABAP Program on Execution ............................................................................. 3
Step1: Using the Screen Conversion Wizard............................................................................... 4
Screen No 2: Screen Conversion Wizard................................................................................. 4
Screen No 3: Wizard Input Screen........................................................................................... 4
Screen No 4: Wizard Output Screen - 1................................................................................... 5
Screen No 5: Wizard Output Screen - 2................................................................................... 5
Step 2: Writing the Business Logic in WDA View Part - I ............................................................ 6
Screen No: 6 Context Attribute which is binded to Airline-ID ................................................... 6
Screen No 7: Context Attribute which is binded to Flight No. .................................................. 7
Screen No 8: PAI Section of SAP Module Pool Program ........................................................ 7
Step 3: Writing the Business Logic in WDA View Part - II ........................................................... 8
Screen No 9: WDA View Output .............................................................................................. 9
Result: .......................................................................................................................................... 9
Related Content............................................................................................................................... 9
Disclaimer and Liability Notice....................................................................................................... 10

2006 SAP AG

Introduction:
We all know that WDA (WebDynPro ABAP), which is going to be SAPs next generation UI technology, offers
you many features that are very interesting to work with. In this article, I am going to explain about one of its
features named Screen Design Time Conversion of WebDynPro Code Wizard and how to get its
maximum benefit.
Screen Design Time Conversion Wizard:
This wizard converts a classical SAP Module Pool Screen into a WebDynPro ABAP View. It gets a SAP
Module Pool Program and its Screen Number as input and gives its corresponding WDA View as Output.
This wizard automatically creates UI Elements, Context Nodes & Attributes and data binding between UI
Elements and the Context Nodes & Attributes. This reduces lot of the development time of the developer.
Before using this wizard please go through its restrictions.
The Business Logic of SAP Module Pool Program is not mapped to the WDA View during the conversion
process. The developer is responsible for the Business Logic of WDA View.
Procedure:
We take a sample ABAP program SAPMDEMO_TRANSACTION which has a simple search screen to
search the details of the flight using the Airline-id and Flight Number.
Screen No 1: ABAP Program on Execution

2006 SAP AG

Step1: Using the Screen Conversion Wizard

1. Create a WebDynPro Component
2. Create a WebDynPro View
3. Click on the WebDynPro View and Click the Code Wizard Icon
.
4. On Clicking that icon you will see the screen below. Here choose Screen,
Screen No 2: Screen Conversion Wizard

5. Enter your Program Name and Screen Number.

Screen No 3: Wizard Input Screen

6. On successfully finishing the step 5 you can see that you have created UI Elements and Context
Elements within a single click.

2006 SAP AG

Screen No 4: Wizard Output Screen - 1

7. You can see that all the UI Elements are automatically binded to the context elements.
Screen No 5: Wizard Output Screen - 2

2006 SAP AG

Step 2: Writing the Business Logic in WDA View Part - I

Now, you need to write the business logic for this WebDynPro ABAP Component. Obviously, for the
ABAP Program you can see that there is a execute button which appears by default during the
execution of the ABAP Program which is not present in the WebDynPro ABAP Component.
So, we will insert an UI element (Button) in the views layout section of the WebDynPro ABAP
Component and On-Click Action of this button we will populate the Screen with the values from the
SFLIGHT table. For better look & feel, move this button to the top most position in the layout.
In the On-Click Event, Create a new event handler in which we are going to write the Business Logic
for this application.
For writing the business logic we will use the WebDynPro Code Wizard

1. Place your cursor in a valid position in the event handler and read the Context Attribute where
the Airline-ID is bounded using the WebDynPro Code Wizard.
Screen No: 6 Context Attribute which is binded to Airline-ID

2. Place your cursor in a valid position in the event handler and again read the Context Attribute
where the Flight Number is bounded using the WebDynPro Code Wizard.

2006 SAP AG

Screen No 7: Context Attribute which is binded to Flight No.

3. Now using these two input values, you need to write a select query to fetch the result from the
SPFLI table. This code you can get from the PAI Section of ABAP Program itself.
Screen No 8: PAI Section of SAP Module Pool Program

4. Now, the work-area of SPFLI will contain the result.

5. Now, we need to store the values in the SPFLI work area to its corresponding context attributes
of the view which are binded to the value attribute of UI Elements in the Layout of the View.

2006 SAP AG

Step 3: Writing the Business Logic in WDA View Part - II

Now, all you need to do is to bind the SPFLI work area results to the respective context attributes of
this View.
For example, the following code sample is used to bind the Departure City Input Field from the work
area SPFLI.
"Set the Departure City.
data:
Node_Spfli_Cityfrom
Elem_Spfli_Cityfrom
Stru_Spfli_Cityfrom
Item_VALUE like

type ref to If_Wd_Context_Node,

type ref to If_Wd_Context_Element,
type If_Display_Flights=>Element_Spfli_Cityfrom ,
Stru_Spfli_Cityfrom-VALUE.

* navigate from <CONTEXT> to <SCREEN> via lead selection

Node_Screen = wd_Context->get_Child_Node(
Name = `SCREEN`
).
* navigate from <SCREEN> to <SPFLI_CITYFROM> via lead selection
Node_Spfli_Cityfrom = Node_Screen->get_Child_Node(
Name = `SPFLI_CITYFROM`
).
* get element via lead selection
Elem_Spfli_Cityfrom = Node_Spfli_Cityfrom->get_Element(

).

* assign the work area value to the item_value

Item_VALUE = spfli_wa-CITYFROM.
* set single attribute
Elem_Spfli_Cityfrom->set_Attribute(
Name = `VALUE`
Value = Item_Value
).
Similarly, set all the context attributes that are binded to the respective input fields in the Layout.
Now, embed the view inside the window and create a WebDynPro Application and execute the
application to view the result.

2006 SAP AG

Screen No 9: WDA View Output

Result:
Congratulations, you have converted a SAP Module Pool Programs Screen into a WDA View.

Related Content
1. Screen Design Time Conversion
2. Screen Design Time Conversion - restrictions

2006 SAP AG

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.

2006 SAP AG

10