Skip to Content
Author's profile photo Former Member

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


  • 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






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


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

table data.JPG

We have the following output


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

Assigned Tags

      You must be Logged on to comment or reply to a post.
      Author's profile photo Former Member
      Former Member
      Blog Post Author

      The code for the FM is not clear. Please view the above blog as a PDF. Sorry for the inconvenience.

      Author's profile photo Guillaume GARCIA
      Guillaume GARCIA


      It would be even better if you could provide SAPLink format for your example ! 😀

      Best regards.

      Author's profile photo Glauco Kubrusly
      Glauco Kubrusly

      Hi Sayan.

      I tryied it but it shows an empty screen on browser.

      Do you know what could be wrong ?

      thank you


      Author's profile photo Laxman Chittepu
      Laxman Chittepu

      Dear Sayan,

      It is very helpful.

      Author's profile photo Former Member
      Former Member

      Dear Sayan,

      some reason I could not make it working. Problme may be with typing.

      Will you please send the above documents as txt file?

      thanks in advance.


      Author's profile photo Bikas Tarway
      Bikas Tarway

      Dear Sayan,

      A very good article, but instead of this it is better to Go with data download to excel and display org chart using MS Visio.



      Author's profile photo Guillaume GARCIA
      Guillaume GARCIA

      Within a desktop scenario, indeed! When displaying on mobile and tablets, this may be questionnable.

      Author's profile photo Former Member
      Former Member

      Really good explanation, but it takes more time to render. is there any option available to make it render fast