Skip to Content

Use of Network UI Element in Web Dynpro ABAP to represent organizational structure

Network UI element is used to represent data graphically in terms of nodes and edges. In this blog I am going to describe how to use a network UI element to represent organizational data.

Here are the steps:

  • Create a Web Dynpro component ZORG_MODEL with view V_MAIN and window W_MAIN
  • Create an attribute in the context DATASOURCE of type XSTRING
  • Add an UI element NETWORK of type Network
  • Bind the property dataSource of the network UI element with the context node attribute DATASOURCE
  • Create a database table ZTEAM_STRUCTURE with the following structure

table.JPG

  • Use the table structure to create the context node TEAM_STRUCTURE
  • Create a function module which will take internal table with team details and give an XML as output

Function.JPG

declarations.JPG

forms.JPG

CREATE_STRUCTURE.JPG

form.JPG

  • Add the following code in the method WDDOINIT of the view controller

WDDOINIT.JPG

  • Create a web Dynpro Application
  • For the following table data

table data.JPG

We have the following output

output.JPG

In my next blog I will analyze the different events associated with Network UI element and modify the database from the graphic designer.

8 Comments
You must be Logged on to comment or reply to a post.