How To Build Web Applications Using MDM Web Dynpro Components · How To Build Web Applications Using MDM Web Dynpro Components December 2013 1 1 Business Scenario SAP NetWeaver Master

SAP NetWeaverHow-To Guide

How To Build Web ApplicationsUsing MDM Web Dynpro Components

Applicable Releases:

SAP NetWeaver Master Data Management 7.1 and higher

Topic Area:Enterprise Information Management

Capability:Master Data Management

Version 2.30

December 2013

© Copyright 2014 SAP AG. All rights reserved.

No part of this publication may be reproduced ortransmitted in any form or for any purpose without theexpress permission of SAP AG. The information containedherein may be changed without prior notice.

Some software products marketed by SAP AG and itsdistributors contain proprietary software components ofother software vendors.

Microsoft, Windows, Outlook, and PowerPoint areregistered trademarks of Microsoft Corporation.

IBM, DB2, DB2 Universal Database, OS/2, ParallelSysplex, MVS/ESA, AIX, S/390, AS/400, OS/390,OS/400, iSeries, pSeries, xSeries, zSeries, z/OS, AFP,Intelligent Miner, WebSphere, Netfinity, Tivoli, Informix,i5/OS, POWER, POWER5, OpenPower and PowerPC aretrademarks or registered trademarks of IBM Corporation.

Adobe, the Adobe logo, Acrobat, PostScript, and Readerare either trademarks or registered trademarks of AdobeSystems Incorporated in the United States and/or othercountries.

Oracle is a registered trademark of Oracle Corporation.

UNIX, X/Open, OSF/1, and Motif are registeredtrademarks of the Open Group.

Citrix, ICA, Program Neighborhood, MetaFrame,WinFrame, VideoFrame, and MultiWin are trademarks orregistered trademarks of Citrix Systems, Inc.

HTML, XML, XHTML and W3C are trademarks orregistered trademarks of W3C®, World Wide WebConsortium, 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 andimplemented by Netscape.

MaxDB is a trademark of MySQL AB, Sweden.

SAP, R/3, mySAP, mySAP.com, xApps, xApp, SAPNetWeaver, and other SAP products and servicesmentioned herein as well as their respective logos aretrademarks or registered trademarks of SAP AG inGermany and in several other countries all over the world.All other product and service names mentioned are thetrademarks of their respective companies. Data containedin this document serves informational purposes only.National product specifications may vary.

These materials are subject to change without notice.These materials are provided by SAP AG and its affiliatedcompanies ("SAP Group") for informational purposes only,without representation or warranty of any kind, and SAPGroup shall not be liable for errors or omissions withrespect to the materials. The only warranties for SAPGroup products and services are those that are set forth inthe express warranty statements accompanying suchproducts and services, if any. Nothing herein should beconstrued as constituting an additional warranty.

These materials are provided “as is” without a warranty ofany kind, either express or implied, including but notlimited to, the implied warranties of merchantability,fitness for a particular purpose, or non-infringement.

SAP shall not be liable for damages of any kind includingwithout limitation direct, special, indirect, or consequentialdamages that may result from the use of these materials.

SAP does not warrant the accuracy or completeness of theinformation, text, graphics, links or other items containedwithin these materials. SAP has no control over theinformation that you may access through the use of hotlinks contained in these materials and does not endorseyour use of third party web pages nor provide any warrantywhatsoever relating to third party web pages.

SAP NetWeaver “How-to” Guides are intended to simplifythe product implementation. While specific productfeatures and procedures typically are explained in apractical business context, it is not implied that thosefeatures and procedures are the only approach in solving aspecific business problem using SAP NetWeaver. Shouldyou wish to receive additional information, clarification orsupport, please refer to SAP Consulting.

Any software coding and/or code lines / strings (“Code”)included in this documentation are only examples and arenot intended to be used in a productive systemenvironment. The Code is only intended better explain andvisualize the syntax and phrasing rules of certain coding.SAP does not warrant the correctness and completeness ofthe Code given herein, and SAP shall not be liable forerrors or damages caused by the usage of the Code, exceptif such damages were caused by SAP intentionally orgrossly negligent.

Disclaimer

Some components of this product are based on Java™. Anycode change in these components may cause unpredictableand severe malfunctions and is therefore expressivelyprohibited, as is any decompilation of these components.

Any Java™ Source Code delivered with this product is onlyto be used by SAP’s Support Services and may not bemodified or altered in any way.

Document HistoryDocument Version Description

2.30 · Links have been updated.

2.20 · SAP NetWeaver 7.3 is now supported.

· As of MDM 7.1 SP07, you can encrypt communication between MDMclients and servers to prevent unauthorized parties from accessingsensitive data. Using a secure connection is documented in the MDMWeb Dynpro Component Reference Guide (see Prerequisites section onpage 1 for links to the relevant sections of the guide).

· As of MDM 7.1 SP07, the MDM Java Connector is packaged in aseparate SCA from the Java API library. This information isdocumented in the MDM Web Dynpro Component Reference Guide(see Prerequisites section on page 1 for links to the relevant sections ofthe guide).

2.10 Terminology updated to reflect changes in the user interface of the MDM WebDynpro Configuration Manager

2.00 The How To Consume MDM Web Dynpro Components v1.0 guide has beensplit into the following two guides:

· How To Build Web Applications Using MDM Web Dynpro Components

Explains how MDM Web Dynpro components are consumed by othercustom Web Dynpro components to create a Web Dynpro applicationwith the flexibility to run as a stand-alone application or in a portalenvironment. This is the guide you are currently reading (as of v2.0).

· How To Integrate MDM and BPM

The guide focuses on how to integrate MDM and Business ProcessManagement (BPM) using MDM Web Dynpro Components and WebServices and is available on SAP Developer Network (SDN) athttp://www.sdn.sap.com/irj/sdn/howtoguides.

The direct link to the guide is: How to Integrate Master DataManagement (MDM) and Business Process Management (BPM)

1.00 First official release of this guide: How To Consume MDM Web DynproComponents

http://www.sdn.sap.com/irj/sdn/howtoguides

http://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/50d7ad1f-6b27-2d10-448e-9c115ce7f5b3?

http://www.sdn.sap.com/irj/scn/go/portal/prtroot/docs/library/uuid/50d7ad1f-6b27-2d10-448e-9c115ce7f5b3?

Typographic ConventionsType Style Description

Example Text Words or characters quotedfrom the screen. These includefield names, screen titles,pushbuttons labels, menunames, menu paths, and menuoptions.

Cross-references to otherdocumentation

Example text Emphasized words or phrasesin body text, graphic titles, andtable titles

Example text File and directory names andtheir paths, messages, names ofvariables and parameters,source text, and names ofinstallation, upgrade anddatabase tools.

Example text User entry texts. These arewords or characters that youenter in the system exactly asthey appear in thedocumentation.

<Exampletext>

Variable user entry. Anglebrackets indicate that youreplace these words andcharacters with appropriateentries to make entries in thesystem.

EXAMPLE TEXT Keys on the keyboard, forexample, F2 or ENTER.

IconsIcon Description

Caution

Note or Important

Example

Recommendation or Tip

Table of Contents

1 Business Scenario.......................................................................................................................... 1

2 Prerequisites.................................................................................................................................. 1

3 Building a Stand-Alone Web Dynpro Application ........................................................................... 4

4 Controlling Field Visibility and Required Properties ......................................................................16

5 Limiting Lookup Field Values ....................................................................................................... 20

6 Setting Field Default Values in an Item Details Component ......................................................... 25

7 Adding Custom Buttons to an Item Details Component .............................................................. 30

8 Integrating MDM Change Tracker and MDM WD Components .................................................... 35

9 Other Examples .......................................................................................................................... 42

9.1 Splitting WD Components into Portal iViews ............................................................................. 42

How To Build Web Applications Using MDM Web Dynpro Components

December 2013 1

1 Business Scenario

SAP NetWeaver Master Data Management (MDM) – Web DynproComponentsSAP MDM Web Dynpro components are consumed (as used components), by custom developed Web Dynprowrapper applications and can be used for customizing or applying different types of business logic to suit avariety of business scenarios such as Business Process Management (BPM).

For more information on how MDM Web Dynpro components can be consumed in a BPM process, see How ToIntegrate Master Data Management (MDM) and Business Process Management (BPM) available on SAPDeveloper Network (SDN) at http://www.sdn.sap.com/irj/sdn/howtoguides.

MDM Web Dynpro components can also be consumed by custom Web Dynpro components. You can create aWeb Dynpro application to run as a stand-alone application or in a portal environment. In this guide wedescribe how to build a generic stand-alone Web Dynpro application.

For more information, see Building a Stand-Alone Web Dynpro Application on page 4.

In addition, you can extend or modify the generic behavior of Web Dynpro components at runtime by usingUser Exits (sometimes called hook methods). User Exits allow you to add your own functionality to SAP’sstandard business applications without having to modify the original applications. There are several differenttypes of User Exits, each of which acts as a hook to which you can attach (or hang) your own code.

For more information on User Exits, see http://help.sap.com/nwmdm71® SAP NetWeaver MasterData Management 7.1 ® Development Information ® MDM Web Dynpro Components: Reference Guide ®MDM Web Dynpro Components User Exits.

The following are some examples of how you can apply User Exits to customize MDM Web Dynprocomponents at runtime to behave according to a particular business scenario:

· You can control the properties of a component (for example, whether a field is visible, required, or read-only).

For more information, see Controlling Field Visibility and Required Properties on page 16.

· You can limit the list of lookup values in a dropdown list for a specific field to show only those valuesthat are relevant for a particular scenario.

For more information, see Limiting Lookup Field Values on page 20.

· You can set default values for specific fields in an Item Details component so that a user does not haveto keep re-entering identical values.

For more information, see Setting Field Default Values in an Item Details Component on page 25.

· You can add a customized tool bar with buttons to the user interface of an Item Details component. Foreach custom button you can also add label translations.

For more information, see Adding Custom Buttons to an Item Details Component on page 30.

· You can split a Web Dynpro application into its components, so that each component takes on theappearance of an individual portal iView.

For more information, see Splitting WD Components into Portal iViews on page 42.

2 Prerequisites...

· Prior knowledge of Web Dynpro (Java).

For more information, see SAP Help Portal at help.sap.com ® Web Dynpro Architecture

http://www.sdn.sap.com/irj/sdn/howtoguides

http://help.sap.com/nwmdm71

http://help.sap.com/saphelp_nw04/helpdata/en/a5/1a1e3e7181b60ae10000000a114084/frameset.htm


December 2013 2

· Before you can develop a Web Dynpro application, the following must be in place:

¡ You have installed one of the following supported SAP NetWeaver releases, together with SAPNetWeaver Application Server (AS) Java:

§ SAP NetWeaver Composition Environment (CE) 7.11 SP04 (or higher)

§ SAP NetWeaver Composition Environment (CE) 7.2

NoteIf you are using MDM Web Dynpro components with Business Process Management(BPM) you need SAP NetWeaver Composition Environment (CE) 7.2 SP03 (or higher)

§ SAP NetWeaver 7.3 or higher.

¡ SAP NetWeaver Developer Studio (NWDS) is installed and running and is the same version asthe SAP NetWeaver AS Java you are running.

¡ You are using SAP NetWeaver MDM 7.1 SP04 or higher.

¡ The MDM repository is mounted and loaded.

¡ MDM JAVA API 7.1.is deployed.

For more information about deploying the Java API library and MDM Connector, seehttp://help.sap.com/nwmdm71 ® SAP NetWeaver Master Data Management 7.1 ®Development Information ® MDM Java and .NET API Developer Guide:

§ Getting Started with Java API

§ Installing and Referencing the MDM Connector ® Installation

§ Deploying the Java API and MDM Connector Using JSPM

¡ MDM JAVA WD FRAMEWORK 7.1 7.11 is deployed.

For more information, see http://help.sap.com/nwmdm71® SAP NetWeaver MasterData Management 7.1 ® Development Information ® MDM Web Dynpro ComponentsReference Guide:

§ Installing the MDM Web Dynpro Environment

§ Deploying the MDM Web Dynpro Components Framework

¡ You have run the MDM Web Dynpro Configuration Manager application and configured yourcomponents.

For more information, see http://help.sap.com/nwmdm71 ® SAP NetWeaver MasterData Management 7.1 ® Development Information ® MDM Web Dynpro ComponentsReference Guide ® Configuring a Project in the MDM WD Configuration Manager.

· You have imported the MDM Web Dynpro and MDM Java API software components (SC) to yourworkspace as follows:

a. In SAP NetWeaver Developer Studio (NWDS), choose the Development Infrastructureperspective as follows:

Window ® Open Perspective ® Other ® Development Infrastructure.

b. Import the MDM_JAVA_API softare component to your LocalDevelopment developmenttrack as follows:

i. In the context menu of the LocalDevelopment track, choose Import SC…

The Import Software Component screen opens.

ii. Browse for the MDMJ710<SP-Number>_P<Patch-Number>.sca file.


http://help.sap.com/saphelp_nwmdm71/helpdata/en/07/75ee377070466c9fb65030ae2ae4af/content.htm

http://help.sap.com/saphelp_nwmdm71/helpdata/en/ad/1905ea6dd541b18d0740b30b7e2c60/content.htm

http://help.sap.com/saphelp_nwmdm71/helpdata/en/1f/1b5a58df8b4f0996876fdef62d7363/content.htm


http://help.sap.com/saphelp_nwmdm71/helpdata/en/4a/de4b01fcb42472e10000000a42189c/frameset.htm

http://help.sap.com/saphelp_nwmdm71/helpdata/en/4a/b90771f2b93d86e10000000a421937/frameset.htm



December 2013 3

c. Import the MDM_JAVA_WD_FRAMEWORK software component to your development trackexactly as you did in step b above for the API. Import the MDMJAVAWDFRW<SP-Number>_P<Patch-Number>.sca file.

The following software components appear in the LocalDevelopment track:

§ MDM_JAVA_API

§ MDM_JAVA_WD_FRAMEWORK.

d. Add a new dependency to the MyComponents SC, for theMDM_JAVA_API andMDM_JAVA_WD FRAMEWORK software components.

· You have created a Destination to establish a connection to the MDM repository.

For more information, see http://help.sap.com/nwmdm71 ® SAP NetWeaver Master DataManagement 7.1 ® Development Information ® MDM Web Dynpro Components: Reference Guide ®Creating a Destination for the MDM Repository.



December 2013 4

3 Building a Stand-Alone Web DynproApplication

ImportantEnsure that you have carried out all the prerequisite steps.

For more information, see Prerequisites on page 1.

Step 1: Create a new development component (DC) project

InfoYou have already imported the Web Dynpro software component (SC) to your workspace. Youare now going to create a new Development Component (DC) Project.

...

1. In SAP NetWeaver Developer Studio (NWDS), choose the Web Dynpro perspective as follows:

File ® New® Web Dynpro Development Component.

2. Choose the software component (SC) where you want the development component (DC) project to becreated (that is, in the LocalDevelopment track select the MyComponents software component).

InfoLocal Development is the name of a local development track, within which there is asoftware component called MyComponents.

3. Name your Web Dynpro DC project test/masterdc.

Step 2: Set the dependencies

InfoDevelopment Components (DCs) may depend on and use each other. To enable a DC to use thefunctionality of another DC, you have to publish their functions in a set of public interfaces calledpublic parts and a dependency to the public part of the DC must be declared. When you declaredependencies, you select only those public parts that your component actually uses.

4. Choose the Development Infrastructure perspective.

5. In the context menu of the test/masterdc DC, choose Show In ®Component Properties.


December 2013 5

6. In the Dependencies tab, add dependencies to the public parts of the relevant UI components as well asthe core ear DC:

For example:

¡ tc/mdm/wdcomps/core/ear (mandatory)

¡ tc/mdm/wdcomps/itemdetails/wd (optional depending on scenario)

¡ tc/mdm/wdcomps/resultset/wd (optional depending on scenario)

¡ tc/mdm/wdcomps/search/main/wd (optional depending on scenario)


December 2013 6

7. Some of the events and interface methods exposed by User Exits use the MDM Java API. To accessthese events or methods, add a dependency to the MDM Java API (to the api public part of thecom.sap.mdm.tech.mdm4j DC).

8. Choose Next to configure the dependencies.

Note

Uncheck the Build Time checkbox of any DC that has a (red X) next to it. The red X meansthat its public parts are for internal use only. The name of the DC is also grayed out.


December 2013 7

Step 3: Create a new Web Dynpro component9. From the Web Dynpro perspective, expand the test/masterdc Web Dynpro DC project.

10. In the context menu of the Components node, create a new Web Dynpro component calledMasterComp.

InfoThe Component Data Modeler is a graphical Web Dynpro design time tool that is integrated intothe Web Dynpro perspective of SAP NetWeaver Developer Studio. It is used to graphicallydefine the main application units such as views and controllers.

11. In the context menu of the MasterComp Web Dynpro component, open the Component Data Modeler.

InfoWeb Dynpro components can use the data and functionality found within other Web Dynprocomponents. To achieve this, a usage declaration must be made to establish a parent-childrelationship between the two components.


December 2013 8

12. To be able to use an external component define component usage as follows:

a. Choose Component Usage from the Palette area on the right hand side of the screen.

b. Drag and drop it onto the work area. A New Web Dynpro Component Usage popup windowopens.

13. Choose Browse to select the required component. Repeat this step for as many components as youneed for your scenario.

In our example, three MDM WD components are referenced: Item Details, Result Set, and Searchcomponents.

14. Create data links between the components you are using and the Component Controller of theMasterComp WD component.


December 2013 9

Step 4: Define the Window

InfoA Window enables the Web Dynpro component to be seen in a Web browser.

15. Choose Components ® MasterComp (name of WD component) ® Windows to open the mainMasterCompWindow window.

16. Delete the default view.

InfoYou are now going to define the Viewset for the layout of your Web Dynpro application.


December 2013 10

17. In the Viewsets area of the Palette, choose,GridLayout.


December 2013 11

18. In the context menu of GridLayout, embed the interface views in the ViewSet cells as follows: EmbedView ® Embed Interface View of a Component Instance.

19. Select the relevant interface view.

20. Choose Finish and save the changes.


December 2013 12

Step 5: Initialize the components

InfoEach controller has its own set of standard hook methods. These methods are calledautomatically when you initialize the Web Dynpro components. It is within these methods thatyou may implement your own code.

21. In the Component Controller of the MasterComp WD Component, initialize the components as follows:Define a variable _repositoryBean of type RepositoryBean in the begin others area asfollows:

//@@begin others

RepositoryBean _repositoryBean = null;

//@@end

22. Enter the relevant code in the wdDoInit method:

NoteWhen using the setConfiguration method, you must supply the configuration projectname and the component name as you defined in the MDM Web Dynpro Configuration Manager(see screen capture below):


December 2013 13

Step 6: Log off23. When closing the application, add the following code to the component’s wdDoExit() method:

NoteThe logoff() method destroys the MDM sessions created by the application.

24. Save your changes.

25. Create an application for your Web Dynpro DC as follows:...

a. Open the Web Dynpro perspective.

b. In the context menu of the Applications node, choose Create Application.

c. Enter a name, for example, MasterApp.

Importantd. Check the Authentication checkbox.


December 2013 14

For more information regarding authentication, see http://help.sap.com/nwmdm71 ® SAPNetWeaver Master Data Management 7.1 ® Development Information ® MDM Web DynproComponents: Reference Guide ® Defining a Trusted Connection.

26. Choose Next and select a reference to an existing WD component.



December 2013 15

27. Choose Next and select the Master Component as the Web Dynpro component.

28. Build, deploy, and run the new test/masterdc Web Dynpro DC.

ResultThe runtime behavior is as follows:

Search Web Dynpro Component

Result Set Web Dynpro Component


December 2013 16

Item Details Web Dynpro Component

4 Controlling Field Visibility and RequiredProperties

At runtime, you can control properties of a field on the user interface of an Item Details component byconfiguring the Raise Event property in the MDM Web Dynpro Configuration Manager. Examples of fieldproperties that you can control are:

· Visible

· Read-Only

· Required

In this example, we show you how to configure field visibility when the property of one field (Vendor Region), isdependent on another field's values (Country). When Country is USA, Vendor Region is visible and required,and when Country is Japan, Vendor Region is not applicable.

Procedure



Configure the Item Details WD component...

1. Using the MDM Web Dynpro Configuration Manager, configure an Item Details WD component.

For more information, see http://help.sap.com/nwmdm71 ® SAP NetWeaver Master DataManagement 7.1 ® Development Information ® MDM Web Dynpro Components: Reference Guide ®Configuring an Item Details Web Dynpro Component.

NoteIn the Item Details wizard, enter the following values:

§ In step 2, add the following three fields: Vendor, Country, and Vendor region.

§ In step 3, set the Raise Event property to True (only for the Country field).



December 2013 17

Set th e Raise Valu e- toTrue (onl y for t he

Configure the Event Handler2. After adding the Item Details WD component as a used component, add a new method to the

Component Controller of the custom WD wrapper application.

3. Choose Event handler as the Method Type.

4. Update the following method properties:

Property Value

Name handleValueChange (any name)

Event Source The name of the Item Details WDcomponent that you created in step 1


December 2013 18

Property Value

SubscribedEvent

ValueChanged

Result:


December 2013 19

Implement the sample code in the wrapper application5. Enter the following sample code for the handleValueChange method. (Any custom logic can be

executed in the Event handler method).

In our example:

¡ USA is selected from the Country field dropdown list.

Enter the following values for the Vendor region field properties:

§ Visible = true

§ Required = true

¡ Japan is selected from the Country field dropdown list.

Enter the following value for the Vendor region field property:

Visible = false (Vendor region field will not appear).


When Country = USA, the Vendor region is visible and set to required * (red asterix). However, when Country= Japan, the Vendor region cannot be seen on the user interface of the Item Details WD component.


December 2013 20

5 Limiting Lookup Field Values...

You can limit the list of lookup field values in a dropdown list for a specific field by configuring the RaiseEvent property in the MDM Web Dynpro Configuration Manager.

This example shows you how to limit the values in a dropdown list of a Region field to show only those valuesthat are relevant for a specific country (for example USA).

Prerequisites· Ensure that you have carried out all the prerequisite steps.


· In addition to the above prerequisites, ensure that:

¡ A Vendor record has been created

¡ There are two lookup tables: MDM_REGIONS and MDM_COUNTRIES, which are interdependent

¡ The Country field in the MDM_REGIONS table is a lookup to the MDM_COUNTRIES table

ProcedureConfigure the Item Details WD component...

1. Using the MDM Web Dynpro Configuration Manager, configure an Item Details WD component.

For more information, see http://help.sap.com/nwmdm71® SAP NetWeaver Master DataManagement 7.1 ® Development Information ® MDM Web Dynpro Components: Reference Guide ®Configuring an Item Details Web Dynpro Component.



December 2013 21

NoteIn the steps of the Item Details wizard, enter the following values:

§ In step 2, add the Country and Vendor region fields.

§ In step 3, set the Raise Event property to True (only for the Countries field). Thisraises an event for the Country field value change.


Component Controller of the custom WD wrapper.



Property Value

Name valueChangedhandler (can be any name)

Event Source Select the name of the Item Details WD component thatyou created in step 1 above.

Subscribed Event ValueChanged


December 2013 22

Implement the sample code in the wrapper application5. Enter the following sample code for the valueChangedhandler method. Any custom logic can be

executed in the event handler method.

Example 1 – using a string to limit field values:



December 2013 23

When you select Country = USA, the Vendor region dropdown list is limited to display only USA relevantregions:

When you select Country = Canada, the Vendor region dropdown list is limited to display only Canadianregions:


December 2013 24

Example 2 – using an MDM value to limit field values by record Ids:

You can also limit the lookup field values to be specific values (MDM internal Ids). For example, when country= USA, limit the Vendor region dropdown list to include regions with internal IDs 1 and 17.


December 2013 25

6 Setting Field Default Values in an ItemDetails Component

...

This example shows you how to define and set default values for fields in an Item Details WD component. Thisoption is used when values are consistent and saves the user from having to keep re-entering the same values.If a value does change, the default values can be overridden.

How is this implemented?A subset of fields in the Item Details WD component is populated with preconfigured default values. When theuser chooses the Create button on the UI of the Item Details WD component, a CreateRecord event is usedas the trigger for a hook method and code is executed (a sample code is provided below).

In this example, default values are set for the following fields:

· Subject – lookup field to Subjects table

· Country – lookup field to MDM_COUNTRIES table

· Vendor region – lookup field to MDM_REGIONS table

· URL – a standard text field

Procedure




1. In the MDM Web Dynpro Configuration Manager, configure an Item Details WD component.

For more information, see http://help.sap.com/nwmdm71® SAP NetWeaver Master DataManagement 7.1 ® Development Information ® MDM Web Dynpro Components: Reference Guide ®Configuring an Item Details Web Dynpro Component.

NoteIn step 2 of the Item Details wizard, select the following fields:

§ Subject

§ Country

§ Vendor region

§ URL



December 2013 26

Field Details

Field Name Field Code Lookup TableLookupValue

LookupValue ID

Subject MDM_MDM_SUBJECT Subjects Brushes 24

Country COUNTRY MDM_COUNTRIES USA 11

Vendorregion

VendorRegion MDM_REGIONS NewYork

28

URL MDM_MDM_URL N/A N/A N/A


December 2013 27

The following screen captures show the MDM Data Manager view of the three lookup tables and foreach, the selected lookup value and its internal ID.

These are the values that have been selected as the default values for the three lookup fields:


December 2013 28





Property Value

Name createRecordHandler (any name)

Event Source Select the name of the Item Details WDcomponent you created in step 1 above.

Subscribed Event CreateRecord

Result showing the new Event Handler method:


December 2013 29

Implement the sample code in the wrapper application5. Enter the following sample code for the createRecordHandler method. (Any custom logic can be

executed in the Event handler method).

The sample code below shows the settings of the following default values:

¡ The first is a multi-valued lookup field, where a multi-value lookup ID is specified.

¡ The second, a URL text field, where a text only value is specified.

¡ The third and fourth fields (lookup fields), where the lookup value record ID is specified.


December 2013 30


In Create mode, the four chosen fields are pre-populated with the default settings.

7 Adding Custom Buttons to an ItemDetails Component

You would typically use this configuration for controlling a BPM process but it can also be used in a stand-alone custom application. Using the MDM Web Dynpro Configuration Manager, you can add a customized toolbar with buttons, give each button a label (multilingual), and insert a unique Status Text (for example, Rejector Approve). These buttons are visible in a separate row on the UI of the Item Details WD component (abovethe standard buttons).

Procedure

ImportantEnsure that you have carried out all prerequisite steps.



1. Using the MDM Web Dynpro Configuration Manager, add the Approve and Reject custom buttons instep 5 of the Item Details wizard. For each custom button, you can add label translations.


December 2013 31

Example showing the Reject button:




December 2013 32



Property Value

Name completeTaskHandler (any name)

Event Source Select the the Item Details WD component youcreated in step 1 above

Subscribed Event completeTaskEvent


December 2013 33

5. In the Data Modeler view, select the data link and choose Edit.

6. Map the context by creating and mapping the BPMStatus context attribute of the Item Details WDcomponent.

NoteAt runtime when you choose any of the custom buttons on the UI of the Item Details WDcomponent, the BPMStatus is filled with the values of the Status Text buttons (for example,Approve or Reject), and the Complete event is fired.


December 2013 34

Implement the sample code in the wrapper application7. Enter the following sample code for the completeTaskHandler method (any custom logic can be

executed in the Event handler method). In our example, the Approve button was chosen. A message,Approve button was pressed is printed by the wrapper application. The same applies for theReject button.

ResultThe following is the runtime behavior when the Approve button is chosen:

The response of the wrapper application to the completeTaskHandler method is:


December 2013 35

8 Integrating MDM Change Tracker andMDM WD Components

The Change Tracker is a Web Dynpro application that provides a user interface for displaying and viewingchanges stored in the MDM Change History database.

This example demonstrates how you can define a custom Web Dynpro wrapper application that uses bothResult Set and Change Tracker Web Dynpro components. A selectRecord event is fired from the ResultSet WD component which passes the record’s internal ID to the Web Dynpro Change Tracker application.However, to list the selected record’s change history, the Change Tracker application expects to receive therecord’s permanent ID. Therefore you need to implement a sample code that will convert the internal ID of theselected record to its permanent ID.

Prerequisites...

· You have configured a Change Tracker application.

For more information, see http://help.sap.com/nwmdm71® SAP NetWeaver Master DataManagement 7.1 ® Integration of SAP Components with MDM ® Change Tracker Application Guide ®Configuration Process.

· You have carried out all prerequisite steps.

ImportantThe name of the Change Tracker Web Dynpro software component that you import to yourworkspace is MDM_WEB_UI.


Procedure...

1. Using the MDM Web Dynpro Configuration Manager, configure an MDM Project and a Result Set WDcomponent.

NoteThe names of the configured Project and the Result Set WD component will be used in thewdDoInit() method of your wrapper application.



December 2013 36

2. Create your custom wrapper WD application using the MDM WD Result Set component and the ChangeTracker as used components.

Reference the steps in the following procedure as a guideline: Building a Stand-Alone Web DynproApplication on page 4. We have highlighted some of the changes that you will have to make for thisexample:

¡ When setting the Dependencies include references to the Result Set WD component, theChange Tracker application, and to the MDM Java API.

¡ When you have defined the Components Usage for this application, you should see the followingresult:


December 2013 37

¡ To initialize the components, add the following code in the '//@@begin others' area of theComponent Controller:

private RepositoryBean _repositoryBean;

private UserSessionContext _userSessionContext;

¡ Add the following sample code to initialize the custom application in the wdDoInit() method:

_repositoryBean = new RepositoryBean();

try

{

wdThis.wdGetResultSetInterface().setRepositoryBean(_repositoryBean);

wdThis.wdGetResultSetInterface().setConfiguration("Proj01","rs01");

_userSessionContext =_repositoryBean.getUserSessionContext();

}

catch (ConfigurationException e)

{

wdComponentAPI.getMessageManager().reportException(e.getLocalizedMessage()

NoteWhen using the setConfiguration method, enter the configuration’s Project name andResult Set WD component name as defined in the MDM Web Dynpro Configuration Manager.

¡ When creating an application for your Web Dynpro DC project, choose your wrapper WDcomponent.

3. Add an Event Handler as follows:

a. After adding the Result Set WD component as a used component, add a new method to theComponent Controller of the custom WD wrapper application.


December 2013 38

b. Choose Event handler as the Method Type.

c. Update the following method properties:

Value Description

Name recordSelectionHandler

Event Source Select the name of the Result Set WD component that you configuredin step 1 above.

SubscribedEvent

recordSelectionEvent


December 2013 39

The result is the following newly added Event handler method with a parameter which is thepermanent record ID value.


December 2013 40

d. Implement the following sample code in the wrapper application‘s Component Controller.

try

{

String tableCode =wdThis.wdGetResultSetInterface().getTableCode();

RepositorySchemaEx schema =MetadataManager.getInstance().

getRepositorySchema(_userSessionContext);

TableId tableId = schema.getTableId(tableCode);

GetPermanentIdFromRecordIdCommand command =

newGetPermanentIdFromRecordIdCommand(_userSessionContext);

command.setRecordIds(new RecordId[]{newRecordId(id)});

command.setTableId(tableId);

command.execute();

int[] permIds = command.getPermanentIds();

if(permIds != null && permIds.length > 0)

{

int permId = permIds[0];

wdThis.wdGetChangeTrackerInterface().setPermanentId(permId);

wdThis.wdGetChangeTrackerInterface().selectLookupTable("" +

tableId.getIdValue());

}

}

catch (SessionException e)

{

wdComponentAPI.getMessageManager().reportException(e.getLocalizedMessage());

}

catch (ConnectionException e)

{

wdComponentAPI.getMessageManager().reportException(e.getLocalizedMessage());

}

catch (CommandException e)

{


December 2013 41

wdComponentAPI.getMessageManager().reportException(e.getLocalizedMessage()); }

At runtime4. After you have built and deployed your wrapper application, add the following as a suffix to the URL link

that is generated: jdbcAlias=<JDBC_Alias>

Where JDBC_Alias is the value you have configured as the JDBC alias property name.

For example:

http://<Host>:<Port>/webdynpro/dispatcher/<WD_application>?jdbcAlias=<JDBC_Alias>

For more information about configuring the JDBC alias property name, seehttp://help.sap.com/nwmdm71 ® SAP NetWeaver Master Data Management 7.1 ® Integration of SAPComponents with MDM ® MDM Change Tracker Application Guide ® Creating a Data Source for aJDBC Connector.

5. Select the record in the Result Set WD component. The Change Tracker application displays the changehistory of the selected record.



December 2013 42

9 Other Examples

9.1 Splitting WD Components into Portal iViews

BackgroundIn this example, we show you how to split a Web Dynpro application into its components, so that eachcomponent takes on the appearance of an a individual portal iView.

ProcessThere are three main steps:...

1. Configure the components.

2. Add your custom wrapper WD application using the components as used components.

3. Add the iViewSplitting property in the application properties and embed the application views inthe ViewContainerUIElements.

InfoThe ViewContainerUIElement is a UI element that offers you options when positioningviews in the browser window. You can embed this UI element in the layout of an existing viewand position it by selecting suitable container layouts (for example, GridLayout).

ProcedureConfigure the components...

1. Using the MDM Web Dynpro Configuration Manager, configure the following components:

¡ Item Details (name it SplitItemDetails)

¡ Result Set (name it SplitResultSet)

¡ Search (name it SplitSearch)


December 2013 43

Add your custom wrapper WD application using the components as usedcomponents

2. Implement the procedure for creating a stand-alone application (some of the steps may not be valid forthis example).

For more information, see Building a Stand-Alone Web Dynpro Application on page 4.

3. In the Component Controller of the wrapper application, initialize the MDM repository bean for the threeused MDM components (using the project name and component name as keys for the configurations).

Code example:


December 2013 44

Add the iViewSplitting property4. Choose New to edit the wrapper application’s properties.

5. Select Predefined as the Type of property.

6. Choose Browse to select a predefined application property.

7. Select the iViewSplitting property.


December 2013 45

8. Set the Value property to true.

The result is as follows:


December 2013 46

Embed the application Views in the ViewContainerUIElements

9. Add three ViewContainerUIElements as placeholders for containing the three views of the WDcomponents.

10. Repeat the above step three times for each Web Dynpro component.

The result is as follows:

11. Under the Windows node, open the SplitToiViewsWindow element.


December 2013 47

12. Drag and drop the Interface View from the Palette and associate the interface view of the threecomponents with the corresponding View element you created in the previous step.

13. Save the changes.

14. Build and deploy the new WD application.

15. Log on to portal as Administrator and from the Top Level Navigation (TLN), locate your WD applicationin the Portal Content role.

16. Copy the Web Dynpro application.


December 2013 48

17. Select the target folder and choose Paste as PCD Object.

ResultThe new object includes the properties of a Web Dynpro portal page consisting of three Web Dynpro iViews –one for each for the three MDM Web Dynpro components:

Portal Page showing Page Content and Layout View


December 2013 49

Portal Page showing the Search, Item Details, and Result Set iViews at runtime:

www.sdn.sap.com/irj/sdn/howtoguides

Documents

How To Build Web Applications Using MDM Web Dynpro Components · How To Build Web Applications Using MDM Web Dynpro Components December 2013 1 1 Business Scenario SAP NetWeaver Master