Web Dynpro ABAP

42 Pages·2006·2.5 MB·English

WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

SDN Community Contribution
(This is not an official SAP document.)

Disclaimer & 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.

© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 1
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

Applies To:
SAP Web AS 7.00
Summary
This tutorial provides a step-by-step guide for developing your first Web Dynpro for ABAP application.
By: Rich Heilman
Company: Yorktowne Cabinetry, Inc.
Date: 12/01/2005
Table of Contents
Applies To:........................................................................................................................................2
Summary..........................................................................................................................................2
Table of Contents.............................................................................................................................2
Step 1 – Creating the Web Dynpro for ABAP (WDA) Object...........................................................2
Step 2 – Creating a View..................................................................................................................4
Step 3 – Adding UI Elements to the View........................................................................................7
Step 4 – Creating the Component Controller Context...................................................................24
Step 5 – Data Mapping...................................................................................................................27
Step 6 – Accessing Data from the Component Controller.............................................................29
Step 7 – Define the Navigational Schema.....................................................................................33
Step 8 – Creating the Application...................................................................................................38
Step 9 – Testing the WDA Application...........................................................................................40
Author Bio.......................................................................................................................................42

Step 1 – Creating the Web Dynpro for ABAP (WDA) Object
Go to transaction code SE80. This is the ABAP Workbench. In the object list box, choose Web Dynpro
Comp / Inf. Enter the name of the object as Z_TUTORIAL1 and hit Enter. The system will ask you if you
want to create this object. Click Yes.
© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 2
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

Enter a description for the object and hit Enter. A dialog will appear asking to assign a package. Click Local
Object.

Now the WDA Object has been created.
© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 3
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

Step 2 – Creating a View
Views contain the UI elements needed for the user to interact with the application. Many different kinds of UI
elements are delivered by SAP.
© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 4
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

Right click on the WDA Object, choose Create, View.

© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 5
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

A dialog will appear, enter START as the view name, and “Start View” as the description. Hit Enter.

Now the view has been created.

© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 6
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

Step 3 – Adding UI Elements to the View
Next, build the user interface for this view. Put a label and an input field on the view. Drag and drop the UI
elements from the icons to the view layout. This can also be done by right clicking on the
ROOTUIELEMENTCONTAINER and choose Create Element.

© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 7
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

A dialog will appear. Enter Label1 as the name of the element and choose Label as the type.

© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 8
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

Now the label has been created in the view. Notice the layout as well as the element under the
ROOTUIELEMENTCONTAINER tree.

© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 9
WDA Tutorial I: Getting Started with
Web Dynpro for ABAP

Create another UI element, this time create an Input field. Right-click on the
ROOTUIELEMENTCONTAINER, choose Create Element, enter the name of the element as INPUT1 and
select the type Input Field from the list box.

© 2005 SAP AG The SAP Developer Network: http://sdn.sap.com 10