![Page 1: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/1.jpg)
Webdynpro ABAP
![Page 2: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/2.jpg)
Contents
Introduction of WebDynpro
MVC Architecture
Difference between JAVA and ABAP Webdynpro
WDA Components and layout
Sample WD Application
2
![Page 3: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/3.jpg)
INTRODUCTION
Web Dynpro for ABAP(WD4A, WDA) is the SAP standard UI technology for developing Web applications in the ABAP environment.
Consists of a graphical development environment with special Web Dynpro tools that are integrated in the ABAP Workbench (SE80).
Webdynpro applications are built based on MVC architecture.
3
![Page 4: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/4.jpg)
MVC Architecture
4
MVC Or "Model View Controller"
Model enables the WD App to fetch data from database or post data into database.
View contains User Interface which helps to display or accept data.
Controller is a medium to connect model and view.
![Page 5: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/5.jpg)
Difference between JAVA and ABAP Webdynpro
In WDA we use ABAP coding to get data but in Webdynpro JAVA we need RFC's or Webservices to get the data.
In WDA the code is stored centrally in the ABAP server, so it relieves the load from developer’s machine where the code is stored in the case of Webdynpro JAVA.
Webdynpro JAVA runs on J2EE engine which can support more number of web users at a time.
5
![Page 6: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/6.jpg)
WDA Explorer
SE 80
6
![Page 7: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/7.jpg)
Webdynpro View Editor
7
Layout Tab Toolbar to “drag and drop”UI element selection
Menu by selecting“Insert Element”
Properties of the UI element
View of context menu from Change selection
![Page 8: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/8.jpg)
WebDynpro Components
Windows Views
Layout Context Methods
Component Controllers Context Events
Window
View Controller
View
Component Controller View
Controller
View
Context Context
Context
WebDynpro Components
![Page 9: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/9.jpg)
Context and Data Transport
Context Like a data
container. Data Transport
between
controllers can
be established
with mapping
defintion.
Window
View ControllerView
Component Controller View ControllerView
Context
Node 1
Root Node
Context
Root Node
Node 1
Node 3
Node 2Context
Node 3
Root Node
![Page 10: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/10.jpg)
Data Binding Process
Data Binding
View
Component controller context
Component text
View controller context
Context mapping Data Binding
View layout
Root Node
FLIGHTS
BOOKINGS
BOOKID
CUSTID
CLASS
PASSN
PRICE
CARRID
CONNID
FLDATE
Root Node
FLIGHTS
BOOKINGS
BOOKID
CUSTID
CLASS
PASSN
PRICE
CARRID
CONNID
FLDATE
![Page 11: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/11.jpg)
Navigation between Views
11
Window
Outbound plug
Navigation link
Inbound plug
Customer List
CustomerSearch
Out In
![Page 13: Do You Want To Build Simple Webdynpro ABAP Application? Here It Is?](https://reader033.vdocuments.net/reader033/viewer/2022061221/54bd37054a795900658b457c/html5/thumbnails/13.jpg)
Worldwide Offices:USA (Dallas)India (Pune)
Partner Offices:Monterrey (Mexico)Frankfurt (Germany)Stockholm (Sweden)
Email: [email protected] Corporate URL: www.architectsap.com