ESS – Anatomy of the 2020 W-4 Webdynpro Application and Customization

Depending on your need, there may come a time where you must customize the standard ESS W4 Webdynpro application in some way. Very typical examples include:

◉ Remove the “delete” column from the list of infotype 0210 records. (many clients do not want to allow the employee to do this).

◉ Change the layout of the “detail” section for a inftype 0210 selected record.
Lucky me…..I got to do BOTH of these so I will talk about them as it comes up in this discussion.

The first task will be determining “where” the application “lives”. I will save you some time here…..it is in the standard package PAOC_ESS_PER_US :

The “application configuration” can be considered our “starting point” when we execute the application. If we open the “application configuration” (this is the value you typical assign to the iView in the portal by setting the “configuration”  parameter), it will launch in the browser editor:

If you click “continue in display mode”, you view details:

The important piece here is on the far right….the “component configuration” (often named as “CC”). Double-click on it, and it will open to really show how the application is pieced together.

Notice on the far left, I have selected the “main page”. This is a Floorplan Manager framework OVP configuration. I will not go into detail about that but to say that it can contain other FPM configurations as well as “freestyle” blocks (such as just “plopping” an existing webdynpro inside the framework). To really understand what we are seeing, here is how the “configuration” side ties over to what a user sees in the runtime:

The top portion is our “list” UIBB and this has it’s own FPM configuration. This makes it VERY easy to create a custom copy of that standard configuration in order to do something like “hide the delete column” (*hint hint*).

The next two sections on the design side (left) are not actually shown/displayed. These are “faceless” components that the app uses. No need to worry over those any further.

The lower/bottom portion is the detailed section. When a user selects an entry in the table, this section displays with additional details (done by the magic of FPM “wiring” which we will touch on briefly). This lower section is NOT built on FPM and therefore does NOT have an “easy” way of changing the layout, labels and such. This is just an plain old WDA that is displayed. As seen, it is HRESS_C_W4.

So that has the basics of our “dissection” (not as nauseating as that frog in 8th grade biology), but what about customizing?

When you want to create custom version of the application….even for the most basic changes….it is a bit like a “russian doll” feeling. You must work your way from top to bottom and then create changes from bottom to top. Sound fun? You first make a copy of the component configuration…a simple “Z” version…you can find the component configuration HRESS_CC_W4_OVP in the package shown above and then simply create a copy:

I will come back to this for the more specific changes. Consider this just our wireframe for the application. Now, we have the component configuration we need to assign to an application configuration. We do not want to change the standard app config, so we just make a “Z” copy of it. Again, in the standard package, we create a copy of HRESS_AC_W4. Once our “Z” version is created, we can go in and edit it.

In edit mode, we can now assign our previously created component configuration to it:

Again, this custom “application configuration” is what you would assign to your iView if using the SAP portal (or passed as a parameter for launchpad config).

OK….so almost done. Now the truly “custom” pieces. Back to the OVP component configuration, you see:

For changing the list/table section at the top as mentioned before, this is quite easy because it is built on FPM framework. In transaction SE80, you will go to the webdynpro component FPM_LIST_UIBB and locate the configuration HRESS_CC_W4_US. You create a copy of it and then can customize as you like. As mentioned, per client request, I simply removed the “delete” column. Back over in the component configuration in the “Overview Page Scheme” settings, I simply replaced the configuration name with my new custom one. In preview mode, it appears as:

If that is all you need, congrats! You are done! However, I was not. My client wanted to change a good bit about the “detail” section. As mentioned, this section is simply the “plain” webdynpro HRESS_C_W4, and therefore, it does not have an “easy” FPM configuration file to adjust. I created a custom copy/version called ZHRESS_C_W4 (clever, I know. haha). The customization of that app is not discussed here. To “tie” the new custom WDA into our configuration though, again, I had to add/update the name in the “Overview Page Schema”. In preview, this appears in the bottom of section 2 as:

Finally, the last…and most important part….we have to make sure to update the “wiring” so that when an row is selected on the top list/table section, that it calls my custom app now and not the standard one. In the “Wire Schema”, make sure to change the settings as needed:

And that is about it. You now can use your customized ESS W4 application.