Using Portal Work Protect Mode in Visual Composer
Work Protect Mode is a Portal feature that helps end-users to prevent data loss when they try to navigate away from the screen they are working on. The way this feature works is, if an application sets a dirty flag to indicate that data might be lost at this point of it isn’t saved, then the portal will display a warning dialog as shown below when users try to navigate to a different Portal screen or application.
If they try to close the browser or tab itself then a browser dialog is displayed instead to indicate that the data might be lost.
SAP provides a Web Dynpro Java class WDPortalWorkProtectMode which can be used to set the Work Protect mode for Portal applications that are built using Web Dynpro Java.
This feature can be enabled for Visual Composer applications by creating a Web Dynpro Java component with the necessary code to set the Dirty flag of the application. This Web Dynpro Java Component can be then embedded in your VC models to control the dirty state of your business logic designed using the VC model.
Here are some of the important steps that I used to implement the Work Protect feature in a VC model.
Web Dynpro Java Component
Define the required level in Initialization methods Component Controller of your Web Dynrpo Java application.
I added the following method to Component Interface and added it’s implementation to the Component Controller. This enabled me to use state parameter in the Visual Composer to set/unset the dirty state of my VC application.
public void setState( boolean state )
Note: In order to use this WDJ DC in your VC applications, you will need a few more configuration settings such as adding the component to public part, creating a component interface, etc. Refer to following guide for more information:
Visual Composer Model
Import this WDJ Component in your VC model. In order to use WDJ DC in Visual Composer you will need Netweaver Developer Studio as this does not work with Web VC. A good idea here would be to create a Visual Composer model as a wrapper around your Web Dynpro Java DC so that you can use that VC model at multiple places using Web VC instead of using NW Developer Studio.
Open your VC model, then navigate to Search and select Provider as Web Dynpro Components. This should allow you to bring your WDJ Development Component into your VC model.
Now depending on your business logic in VC model set this flag to True or False. For example, when end-users switch from Display to Edit mode, you can set this flag to true, which will end up setting the application to ‘Dirty State’ as far as Portal is concerned. Similarly unset it when end-users switch from Edit to Display mode, for example, after saving all the records on their data entry screen.
End-user Work Protect Mode setting
Set the end-user Work Protect Mode by navigating to Personalize option on the Portal.
If you do not see a Personalize link, then ask your system admin to add role ‘eu_role’ to your user.
Test your Visual Composer application on the front-end. Ensure that you do not open it in a standalone window and it is opened inside the Portal environment. You might have to restart your browser when you turn on the Work Protect Mode in Portal settings.
If you try to navigate away from this application or close the browser window, you should see a warning message along with options to handle how you want to proceed.
Important links and references:
I recommend that you read or glance through these links to learn more about using Web Dynpro Java Components in Visual Composer and Work Protect Mode.