Upload
sathish-b-sathish
View
55
Download
8
Tags:
Embed Size (px)
DESCRIPTION
WEB DYNPRO
Citation preview
SAP ABAP, WebDynpro
Wednesday, 22 February 2012
Scenario: To create and run a simple WebDynpro Application. We would accept an input value
from the user on first screen and display the value entered on the second screen. [Screen
Navigation]
Note: Please refer to the SAP help for detailed information of the components used in this
document.
Procedure:
1. Go to transaction SE80. Please note that there is no separate transaction for creation of
WebDynpro application other than SE80.
2. Select WebDynpro Comp./Intf from the list (as shown below)
Building a simple WebDynpro application
Search
Google Search
Home Page
Yahoo
Play Free Games
Pages
Join this sitew ith Google Friend Connect
Members (5)
Already a member? Sign in
Followers
2012 (10)
Blog Archive
0 More Next Blog Create Blog Sign In
3. Create a new WebDynpro component by the name ZSAPTECHNICAL_DEMO.
Assign it to the local object.
4. Right click on the WebDynpro component ZSAPTECHNICAL_DEMO and create a view.
February (10)
SAP ABAP interview questions andanswers 1. Can w...
SAP ABAP Webdynpro InterviewQuestions and Answer...
Using Select-Options in Web Dynpro forABAP Creat...
Calling an URL on click of a button (WebDynpro f...
OVS help in the WebDynpro application(WebDynpro ...
The ALV application:Create a webdynpro applicati...
Building a simple WebDynpro applicationScenario:...
ABAP INTERNAL TABLE Attributes ofInternal tabl...
ABAP String Manipulation : Stringmanipulation is...
ABAP Data Types Difference betweenType & Like:...
Sam Siv
Follow 3
View my complete profile
About Me
Save the application
5. Double-click on the COMPONENTCONTROLLER.
6. Check if the application is in change mode.
7. Create a node as shown below:
8. Create an attribute for the node as shown below:
Save the application.
9. Double-click on the view, FIRST_VIEW, created earlier.
In this step, we would be designing the first screen of our application with the following
elements:
Label for the input field
Input field
Button (for Submit)
Drag and drop the element Label onto the layout.
After dragging and dropping onto the layout, change the text of the Label to Username in
the right side bottom of the window.
Now drag and drop the input field onto the layout.
Now click on the Label element created earlier and set the property of LabelFor to
INPUT_FIELD.
Finally, drag and drop the element Button on to the layout.
In the properties window of the Button, do the following:
Change the text to Submit
Click on Create for the property OnAction.
Enter the Action and the Outbound Plug name.
Press OK for the creation prompt of Outbound Plug.
Click on Contexttab. Drag and drop the Node on the right side to the context on the left side.
Click on YES for the prompt for the node to copied and mapped.
Save the application.
Click on Layout tab now.
Double-click on the Input_field and in the properties:
a) For the property Value, select the attribute Name by clicking on the binding button.
We are done with designing of the first screen.
10. In this step, we would design the second screen of our application.
Right-Click on the WebDynpro component and create another view, SECOND_VIEW.
Create a label, Entered Name as mentioned in the earlier step.
We would display the value entered on the first screen in an element called text view.
Drag and drop the element Text View onto the layout.
Click on Context tab and map the nodes as in our earlier step.
Go to Tab Inbound Plugs and create an inbound plug as shown below:
Go back to the layout now.
Now double-click on the element TextView to open the properties. For the property
Text, click on the binding button and select Name
11. In this step, we would embed the above created views in the window created in the
first step.
a) Double-click on the window MAIN_WINDOW.
b) Right-click on the window name and select EMBED VIEW.
c) Embed both the views created earlier. Do not select the view EMPTYVIEW
which is created by default.
d) Expand the tree.
e) Now right-click on SUBMIT and select Create Navigation.
f) Select SECOND_VIEW for the dest.view.
g) Now select the FIRST_VIEW and make it as default.
Save and activate the application (When activating, select all the six components
related to this webdynpro application. If all six components are activated, only
then your application executes)Now your application is ready to execute. Lets
look at the method of testing this application.
Testing your WebDynpro Component
1. Right-click on the WebDynpro Component and create WebDynpro Application.
2. Without changing any values, press SAVE.
3. Execute your WebDynpro application.
Newer Post Older PostHome
Posted by Sam Siv at 03:44
Labels: Webdynpro
Recommend this on Google
Enter your comment...
Comment as: Google Account
Publish
Preview
Create a Link
No comments:
Post a Comment
Links to this post
Subscribe to: Post Comments (Atom)
Watermark template. Powered by Blogger.