An Extended Web Dynpro ABAP Application

Download An Extended Web Dynpro ABAP Application

Post on 12-Apr-2015

17 views

Category:

Documents

4 download

Embed Size (px)

TRANSCRIPT

An Extended Web Dynpro ABAP Application

NetWeaver 2004s Release

SAP Online Help

3/30/2006

Copyright Copyright 2004 SAP AG. All rights reserved. No part of this publication may be reproduced or transmitted in any form or for any purpose without the express permission of SAP AG. The information contained herein may be changed without prior notice. Some software products marketed by SAP AG and its distributors contain proprietary software components of other software vendors. Microsoft, WINDOWS, NT, EXCEL, Word, PowerPoint and SQL Server are registered trademarks of Microsoft Corporation. IBM, DB2, DB2 Universal Database, OS/2, Parallel Sysplex, MVS/ESA, AIX, S/390, AS/400, OS/390, OS/400, iSeries, pSeries, xSeries, zSeries, z/OS, AFP, Intelligent Miner, WebSphere, Netfinity, Tivoli, Informix and Informix Dynamic ServerTM are trademarks of IBM Corporation in USA and/or other countries. ORACLE is a registered trademark of ORACLE Corporation. UNIX, X/Open, OSF/1, and Motif are registered trademarks of the Open Group. Citrix, the Citrix logo, ICA, Program Neighborhood, MetaFrame, WinFrame, VideoFrame, MultiWin and other Citrix product names referenced herein are trademarks of Citrix Systems, Inc. HTML, DHTML, XML, XHTML are trademarks or registered trademarks of W3C, World Wide Web Consortium, Massachusetts Institute of Technology. JAVA is a registered trademark of Sun Microsystems, Inc. JAVASCRIPT is a registered trademark of Sun Microsystems, Inc., used under license for technology invented and implemented by Netscape. MarketSet and Enterprise Buyer are jointly owned trademarks of SAP AG and Commerce One. SAP, SAP Logo, R/2, R/3, mySAP, mySAP.com and other SAP products and services mentioned herein as well as their respective logos are trademarks or registered trademarks of SAP AG in Germany and in several other countries all over the world. All other product and service names mentioned are trademarks of their respective companies. Data contained in this document serves informational purposes only. National product specifications may vary.

2

SAP Online Help

3/30/2006

Icons in TextIcon Meaning Caution Example Note Recommendation Syntax More icons are used in the SAP Library documentation to help you identify different types of information. For more information, see Help on Help General Information Classes and Information Classes for Business Information Warehouse on the first page of any version of the SAP Library.

Typographic ConventionsFormat Sample text Description Words or characters that appear on the screen. These include field names, screen titles, pushbutton labels, menu names, menu paths, and menu options. Cross-references to other documentation Sample text SAMPLE TEXT Emphasized words or phrases in the body text, titles of graphics and tables. Names of system objects. These include report names, program names, transaction codes, table names, and key concepts of a programming language surrounded by body text - for example, SELECT and INCLUDE. Output on the screen. This includes file and directory names and their paths, messages, source code, names of variables and parameters as well as names of installation, upgrade and database tools. Exact user entry. This includes words or characters in the documentation that the user is instructed to enter on the screen. Variable user entry. The user must replace the words and characters in brackets with appropriate entries before entering the text in the system. Keys on the keyboard, for example, F2 or ENTER.

Sample text

Sample text SAMPLE TEXT

3

SAP Online Help

3/30/2006

Creating an Extended Web Dynpro ABAP Application .......................................................... 5 Quiz Application ..................................................................................................................... 6 Designing a View Model ...................................................................................................... 10 Defining a View Composition ............................................................................................... 12 Implementing the View Composition ................................................................................... 17 Designing a View Layout ..................................................................................................... 18 Controller Contexts .............................................................................................................. 25 Defining Data Binding .......................................................................................................... 32 Define Action Events ............................................................................................................ 34 Implementation of Individual Coding Extracts...................................................................... 37 Embedding Views in a Window............................................................................................ 42 Creating Navigation Transitions ........................................................................................... 45 Debugging in Web Dynpro ABAP ........................................................................................ 48

4

SAP Online Help

3/30/2006

Creating an Extended Web Dynpro ABAP ApplicationTasko o o o o Creating a Web Dynpro application with multiple views and a navigation structure Working with event handlers (action event handlers, inbound plug event handlers) that you declare yourself Reading contents from the property resource bundles and storing them in a Web Dynpro context (value nodes, value node elements) Dividing data between view controllers and component controllers using context mapping Manipulating UI element attributes at runtime using data binding

PrerequisitesSystems, Installations, and Authorizationso o Access to SAP NetWeaver (release NW 2004s or higher) You have authorization for transaction SE80 (development environment).

Knowledgeo o Experience with the ABAP programming language and the ABAP development environment Basic knowledge about programming Web Dynpro applications

5

SAP Online Help

3/30/2006

Quiz ApplicationThe extended Web Dynpro application is a short quiz on subjects related to Web Dynpro. The first page of this quiz application should look like this:

A single view then appears that contains a welcome text and a pushbutton to start the quiz. The quiz contains seven questions and the corresponding answers. The first question is displayed in a separate view when you choose Start Quiz. Next to the question, another view with a question mark appears.

6

SAP Online Help

3/30/2006

When the user chooses Show Answer, the question mark disappears and the answer is displayed.

7

SAP Online Help

3/30/2006

When an answer is displayed, the button Show Answer is visible but not active. The subsequent question is displayed when the user chooses Next Question. The Next Question button does not appear when the user reaches the last question.

When the user chooses End Quiz in the answer view, the system terminates the quiz. The two views Question and Answer disappear. In the upper view, a short goodbye text and a new Exit Quiz button are displayed. This button terminates the quiz application and the system navigates to an Internet page. You can, however, branch to the first question in the quiz by choosing the Start Quiz pushbutton.

8

SAP Online Help

3/30/2006

9

SAP Online Help

3/30/2006

Designing a View Model...

Defining the Basic Structure of the ApplicationIn this example, the user interface is to consist of four views:

Welcome

Question

QuestionMark

Answer

Welcome: Displays a message when starting or ending the application (welcome and goodbye messages). Start or exit point for the quiz. Question: Displays a quiz question from which you can navigate to the next question or display the corresponding answer. QuestionMark: This area is used to display an unanswered question. Answer: Displays an answer for current quiz question. Option to end the quiz by moving on to the goodbye message in the Welcome view.

In a Web Dynpro application, the views contain the actual user interface elements. The following graphic shows how to reach the individual views and specifies the basic navigation structure.

Welcome

Question

QuestionMark

Answer

10

SAP Online Help

3/30/2006

Layout of the Web Dynpro WindowA Web Dynpro component is represented internally by a Web Dynpro window. Web Dynpro windows consist of individual views that are held together using a suitable medium, in this case, the main view (with the matrix layout).

Window Main View View Area Top colspan = 2

View Area Left colspan = 1

View Area Right colspan = 1

11

SAP Online Help

3/30/2006

Defining a View CompositionView Composition Without NavigationAssign the four views Welcome, Question, QuestionMark, and Answer to the three view areas. At design time, you can model the state of a view area that is empty at runtime using specific empty views. These empty views do not contain UI elements, but can be used to define the view composition.

At runtime, only one view can be displayed within a view area. The default view, which is initially displayed, is the Welcome view in the top view area and the default view for the remaining two view areas is the empty view. The assignment of views and empty views to the three view areas top, left, and right specifies all possible view assemblies that is, the possible combinations of views that can