Introduction to SAP NWBC

Most of the SAP'ers first questions would be, What does NWBC stands for? well, Netweaver Business Client is the full form on acronym NWBC.

NWBC vs SAP GUI:

NWBC is a desktop client just like SAP GUI which can be used as a one stop shop to logon any SAP systems available for that client similar to GUI but has additional use cases compared to NWBC.
Using Single Sign On concept you can access multiple systems transactions using single log on. Also described as Access to one main systems and casual access to other systems. It can be used to access Dialog Transactions, Webdynpro Applications, Portal based applications, Mobile applications and many more at one place. In easy terms, it means that we will have the ability to integrate multiple UI technologies into a single client.

Simple difference between NWBC and SAP GUI is the way you can access Webdynpro Application. Using SAP GUI, when you execute WD application it opens in a browser whereas on NWBC it opens within the GUI just like a normal dynpro transaction if that application is added to your role.

NWBC works on Role based access. That is, when you log in to particular system using NWBC, you will see only those transactions in the roles assigned to you and also basically,  NWBC look and feel is defined using roles.

NWBC Releases:

So far SAP has released 3 versions of NWBC which are, 3.0, 3.5 and 4.0. All the screen shots and notes in my blog are from 3.5 version. One main difference between 3.5 and 4.0 is, to be able to use NWBC 4.0, you should have latest version of GUI which is 740.

NWBC Types:

There are 2 types of NWBC versions, one is Desktop Based and the other is HTML based. HTML based is where we can access NWBC using web browser and Desktop based needs Application needs to be installed on our machines.

NWBC Screen glimpses: 

Let me try to show as how does it look when you login to NWBC and what are each sections called using some screen shots,

There are 4 main sections,

1. Navigation Panel (Left Side Panel)
2. Navigation Tabs (Tabs on the top to navigate through various folders)
3. Canvas - Actual section where we see the transaction.
4. Quick Launch bar - It would be generally above Navigation Tabs.

Just like on your browser where you can Hide/Show various sections/add-ons, even in NWBC we have the option to hide most of the sections in the Personalize option.

How to Configure/Set-up NWBC:

Now, coming to the key point of this blog as how to configure/setup an NWBC for your client, NWBC is a free software which can be downloaded from Service Market place. To be able to use NWBC for your system, one particular service needs to be activated on your system using SICF transaction which is, /sap/bc/nwbc and its components under it.

Note: Before activating this service, there are other generic settings for an SAP system like FQDN set-up, HTTP setting for the system etc which are common to get Webdynpro and other web related applications work which are mostly done during initial system set-up itself.

Once you have this service activated, next step is to set-up roles as per business scenario using PFCG transaction.

Setting up Roles:

Step 1: Create Role using PFCG.

Step 2: Maintain Menu Item in the role. Key point to remember when setting up Menu is, You have to first create a folder and then add Transactions inside that folder, only then those tcodes show up in the folder of NWBC.

Step 3: Now, add Transactions, Webdynpro applications, HTML pages and many more inside the folders.

Step 4: Assign User to this Role: Click on the User Tab and add the user name to whom this role needs to be added.

That completes list of basic steps performed to configure NWBC. When you login to this system through NWBC, it would look some what similar to the screen shown below:

You can see the Folders added in PFCG on the Navigation tabs. When you click on a particular tab, it will show all the transactions in that folder below that tab and also on the navigation panel.

SAP did provide many options to customize even particular folder. In PFCG transaction, when you double click a particular folder it will show you all the options to customize even the folder,

Also, in PFCG, Menu Tab where you add folders, you have lot of other options too shown below which can also be used to customize NWBC look.

Side Panel Concept on NWBC: 

Side Panel is another important concept which is, on your NWBC you can add a Side Panel which will show an option to add your own navigational links on to the right part of the screen which can be viewed on demand basis. This Side Panel can be added specific to your client or also at Role Level in PFCG.

Before I confuse you more, let me show a screen shot of the same :), in the below screen shots I am adding Side Panel to just my login,

On your NWBC login, navigate to Settings, Connections, Side Panel, it will bring up a pop-up where you can add Side Panel to your NWBC client. If you are doing this way, you can just add HTTP links to your side panel. In the below screen shot, I am adding bing.com as a side panel link to my client, once added you can see that a button on the right is added which will open your side panel.

After adding, it looks like:

Adding Side Panel at PFCG Role Level:

Now, I am making a complete folder as a Side Panel on my PFCG Role,

My NWBC looks like, as you can see below I see 2 transactions, one in main canvas and the other in side panel.

As per few blogs I have seen, NWBC does provide an option to access multiple systems thorough single client logic based on Single Sign-On concept of SAP. That is one of the very useful feature which business would be interested as most of SAP clients have more than one SAP system, they would like the option of NWBC to access more than one system using single log on.

Thanks to Julie for her blog on SDN, which has very good information about NWBC:

http://scn.sap.com/docs/DOC-8193

ALV in Webdynpro Application

ALV Output display is one of the most used concept in SAP to meet business requirements. Currently to develop ALV on a normal dynpro output, there are various methods in ABAP. Initially Functional Modules were used to develop ALV's, later SAP introduced Object Oriented classes to develop ALV and introduction of OOP's did help in adding quite new features

Simple ALV on a Webdynpro application is quite simple to develop. In the below example, I am trying to display SPFLI output on an ALV.

First Step is to Create a new Webdynpro Application through SE80 with a View and a Window.

In this example, I have my data retrieval logic inside Main View(WDDOINIT) but you can also have that in Component Controller itself and fill the Context node in a WDDOINIT of Component Controller.

After WD Component is created, go to the Used Component section in the WD definition and add Component Usage for SALV_WD_TABLE.

About SALV_WD_TABLE: For some of the core features of ABAP, SAP has already developed re-usable components which can be used to get required functionality. Another example for this is, WDR_SELECT_OPTIONS using which we can display Select-Options on our Webdynpro Application.

Create a Context Node of Type SPFLI and add all its fields to the node(You can use Add Attributes from Structure button to add all the fields of that table in the node). Dont forget to make the Cardinality as 0..n to indicate that its a table and not structure type.

Next Step is to Create a View and add Context Node type SPFLI and Bind it to the Component Controller Context node.(You can even directly use Context node created in Controller directly here just by dragging and dropping).

Here, I am dragging Node from Controller to View.

Now, click on the MAIN View, and add an element of type ViewContainerUIElement and give an ID to it.

Important point here is, whenever you add a View ContainerUI Element, it provides and option for you to embed another view(which displays data) to it in the Window section.

Until here, we are done with the part of creating Context Node, View, adding a view container to the view. Next step is to fill the Context node table with the data.

In the WDDOINIT, write code to get data and then bind it to context node table. Binding part can be done easily using code generation wizard provided by SAP as shown below.

and the code generated is,

  DATA lo_nd_spfli TYPE REF TO if_wd_context_node.

  DATA lt_spfli TYPE wd_this->elements_spfli.

* navigate from <CONTEXT> to <SPFLI> via lead selection
  lo_nd_spfli = wd_context->get_child_node( name = wd_this->wdctx_spfli ).

  SELECT * FROM spfli INTO TABLE lt_spfli.

  lo_nd_spfli->bind_table( new_items = lt_spfli set_initial_elements = abap_true ).

With this we are done with the part of filling context node, next step is to Bind the Context Node with the SALV_WD_TABLE context node.

Logic here is, when we develop ALV using function module, we pass our output internal table data to the function modules ALV data table and that data will be shown on the output screen in an ALV, similarly in Webdynpro once you bind Context Node table data to SALV* data node, output is shown in ALV. Binding is done as below,

Whenever you add a Component Usage(Another WD Component) to the Webdynpro, interface controller of that WD component will be available in our WD too and you can see that in the left tree under component usages node.

Double click on the Interfacecontroller_Usage node and in the context, Map SPFLI node to Data Node of SALV* component as shown below,

I have dragged SPFLI node to Data Node.

Now, in the window, navigate to the ALV View container, right click on that and click on Embed View and then in the pop-up select the ALV data view, once you do that it will look somewhat shown as below

That is the last step in the development, we are ready with an SPFLI ALV output. Once you create a WD Application for this component and execute it, it looks like below screen shot.

In my next blog, I will write as how to handle configurations to the ALV, similar to Layout options we do on dynpro ALV.