ENTERPRISE SERVICE CONSUMED BY INTERACTIVE FORM

INTERACTIVE FORMS AND ENTERPRISE SERVICES

0

ENTERPRISE SERVICE CONSUMED BY INTERACTIVE FORM

Exercise / Solution

INTERACTIVE FORMS AND ENTERPRISE SERVICES 1

Create an Interactive Form that consumes an Enterprise Service

The SAP Discovery System business scenario starts with a Sales Order, where a sales agent can order a product for a specific customer. In this exercise, you will build a similar Interactive Form in which the user can fill a sales order for an internal department by inputting the department, product, quantity purchase order. This will allow the departments of your company to buy products.In this exercise you will design your form and bind the form fields to the Sales Order Web Service in order to pass the data to the back-end.

Procedure1. Download a WSDL file from SDN (In a course room environment, this file may come

from an instructor):a. Go to SDN SAP Discovery System for Enterprise SOA Exercises page -

https://www.sdn.sap.com/irj/sdn?rid=/webcontent/uuid/62509489-0d01-0010-80a6-f9a32a79fa90

b. Click through and save “Download exercise WSDL file”c. Unzip file and save to your local drive.

2. Logon to SAP Discovery System through Remote Desktop Connection(user=Administrator, Pwd=sap123).

3. For creating an Interactive Form you need first to create a Web Dynpro project. Begin by creating a Web Dynpro project by following these steps:a. Open SAP NetWeaver Developer Studio (NWDS) by double-clicking icon on

desktop.


2

b. Select the Web Dynpro perspective from the menu “Window”.

c. Create a new Web Dynpro project; enter a name for the project, such as: MyForm. To create a Web Dynpro project, go to the menu “File” -> “New” -> “Web Dynpro Project”.

d. Once you clicked on finish, the Web Dynpro project structure will appear in the left “Web Dynpro Explorer” tab. Expand the Web Dynpro node, stand on the Application node, right-click and select “Create Application” (see picture below)


3

e. In the window enter an application name called “MyFormApp” and package “com.sap.test.myform”. Click twice on the “Next” button and then click on the “Finish” button.

By expanding your Web Dynpro project tree, you see that have just created a Web Dynpro application with an empty View called “MyFormAppView”. See picture on the right.

f. Double-click on the “MyFormAppView” node. It opens the layout tab of the MyFormAppView. See picture below:


4

g. Drag the Adobe~InteractiveForm icon to the “MyFormAppView” panel

h. Add a context element and assign it as a pdfsource:

- Go to the “Context” tab of the View- Right-click on the context node and select “Value Attribute” (see image below)

- Name the “value attribute” as “pdfObject”- Go to the properties the “pdfObject” value Attribute

Set the type as “binary”. See picture on the right.-


5

- Go to the “Layout” tab of the View and right-click on the InteractiveForm component, select “Properties”. See picture below.

- In the properties, assign the “pdfObject” attribute to the “pdfSource” property , see picture below.- Increase the height and width properties to 800px

- Leave the “dataSource” field in the properties empty- Save your Web Dynpro project


6

4. Now you are ready for creating an Interactive Form:

a. You have now an UI element called “InteractiveForm1”. In the “Outline” tab, stand on the “InteractiveForm1” node, right-click and select “Edit” form the popup menu. See picture below:

As a result, the Adobe Lifecycle Designer tool is displayed (it might take few). See picture below:

b. You have in the middle of the screen the “Body Pages” tab of your Interactive Form, it is currently empty. Thisis where you create the UI. You have on the right side a tab called “Library” where are displayed UI components. You can drag the UI components of your choice to the “Body Pages” tab.Start to build your UI for making it similar to this one:

BODY PAGES TAB

DATA VIEW TAB

OBJECT TAB

LIBRARY TAB


7

Use only TextField and Drop-down List (not Decimal or Numeric Field)

c. Save your project (Ctrl+Shift+S)d. Populate the Drop-down Lists. You have 2 Drop-down List and you need to enter the data displayed in the

tables below. One drop-down list needs to display a list of Internal Departments and the second one need to display a list of Products.

Department list:Department Name Department Cost CenterIT I1234Marketing I5678

Product list:Product Name Product IdAppliance T20000Contraption T20010

To populate a drop-down list, Select the drop-down list on the “Body Pages” tab. Then select the “Field” tab from the “Object” tab on the right side

of the screen. Enter the product names one by one as seen on the picture on the

right.

Drop-down ListText Field

Button


8

Then move to the “Binding” tab for assigning a product id to each product name. The product id is inserted in the Value column. See picture on the right.

Do the same for the Department drop-down list

5. Bind the Interactive Form to the Enterprise Web Service: Now that you have built the UI of form, we have to pass the data entered in the form to the back-end. We use a Sales Order Web Service for passing the data from your form and creating a sale order. The Sales Order Web Service is deployed on the SAP Web Application Server. You will use the so_service.wsdl file downloaded in step 1.

a. Create a Data Connection: Right-click on the Data View tab located on the left of the “Body pages”


9

b. The “New Data Connection” wizard window opened. Select the “WSDL File” radio button, see picture below

c. Click Next, browse to select the WSDL file downloaded in Step 1 which will connect to the Sales Order service deployed on the SAP Web Application Server.


10

d. Click Next. The remote method of the Sales Order Web Service is displayed “createSO”. Select “createSO” and click “Finish” . See picture below

e. Now you can see in the “Data View” tab a tree that represent the parameters and return value of the Sales Order Web Service.The “createSO Request” node displays all the parameters that are passed to the Sales Order service. The “createSO Response” node displays the parameter that the Sales Order service returns after completion.The “createSOBtn” is used to call the Web Service.

Now you are ready to bind the Web Service parameters to the UI of the form. If you get the pop-up below, select“Don’t update any related properties” and “Don’t show this again”


11

f. We have to bind each of the UI elements to a node in the “Data View” tab:i. Drag and drop the “purchaseNumber” node on the “PO number” textfield.ii. Drag and drop the “purchaseDate” node on the “PO date” textfield.iii. Drag and drop the “customerId” node on the “Sold-to department” drop-down list.iv. Drag and drop the “productId” node on the “product” drop-down list.

v. Drag and drop the “price” node on the “price” textfield.vi. Drag and drop the “quantity” node on the “quantity” textfield.vii. Drag and drop the “Response” node on the “status” textfield.viii. And finally drag and drop the “createSOBtn” node on the button “submit”. Because of a bug in Designer,

you wont see the “link” icon next to the “createSOBtn”. You can check that the mapping has been well applied by selecting the button and select the “Binding” tab in the “Object” tab on the right of the screen. In the “Import/Export Bindings” field you should see the mapping.

You see now these icons that means that your parameters are bound to a UI.

6. Save (Ctr+Shift+S), build the Web Dynpro project, deploy and run:a. Rebuild the Web Dynpro project by standing on the root

tree of the project , right-click , select “Rebuild”. See picture at right.


12

b. Deploy and run: Stand on the “MyFormApp” node under the “Applications” node (see picture below). The password to the SDM (for deployment) is “sap1234”.

ResultYour Interactive form is displayed inside a Web Dynpro application, you can save it as a pdf file by clicking on the save icon. You can fill the form and test it. Select a department, type any PO number, select a product and enter 1 as quantityand 20 as price :


13

Copyright 2005 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, Outlook, and PowerPoint 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, and Informix are trademarks or registered trademarks of IBM Corporation in the United States 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, ICA, Program Neighborhood, MetaFrame, WinFrame, VideoFrame, and MultiWin are trademarks or

registered trademarks of Citrix Systems, Inc. HTML, XML, XHTML and W3C 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. MaxDB is a trademark of MySQL AB, Sweden. SAP, R/3, mySAP, mySAP.com, xApps, xApp, SAP NetWeaver 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 the trademarks of their respective companies. Data contained in this document serves informational purposes only. National product specifications may vary.

The information in this document is proprietary to SAP. No part of this document may be reproduced, copied, or transmitted in any form or for any purpose without the express prior written permission of SAP AG.

This document is a preliminary version and not subject to your license agreement or any other agreement with SAP. This document contains only intended strategies, developments, and functionalities of the SAP® product and is not intended to be binding upon SAP to any particular course of business, product strategy, and/or development. Please note that this document is subject to change and may be changed by SAP at any time without notice.

SAP assumes no responsibility for errors or omissions in this document. SAP does not warrant the accuracy or completeness of the information, text, graphics, links, or other items contained within this material. This document is provided without a warranty of any kind, either express or implied, including but not limited to the implied warranties of merchantability, fitness for a particular purpose, or non-infringement.

SAP shall have no liability for damages of any kind including without limitation direct, special, indirect, or consequential damages that may result from the use of these materials. This limitation shall not apply in cases of intent or gross negligence.

The statutory liability for personal injury and defective products is not affected. SAP has no control over the information that you may access through the use of hot links contained in these materials and does not endorse your use of third-party Web pages nor provide any warranty whatsoever relating to third-party Web pages..

SAP assumes no responsibility for errors or omissions in these materials

ENTERPRISE SERVICE CONSUMED BY INTERACTIVE FORM

Documents

Transcript of ENTERPRISE SERVICE CONSUMED BY INTERACTIVE FORM