Show TOC

Implementing a Custom WorkProtect PopupLocate this document in the navigation structure

Context

In addition to customizing the standard WorkProtect popup by configuration, you can replace it by your own custom implementation.

Procedure

  1. Develop a portal application that implements a custom WorkProtect popup box.

    This box is displayed by the portal as a modal window. It should return one of the following values:

    • DESKTOP : discard the changes and open the new page in the same window

    • NEWWIN : protect the unsaved data by opening the new page in a new window

    • CANCEL : cancel navigation and stay on the page to save the changes

    All other values are ignored.

    The following example shows a basic HTML page that displays three buttons. Each button returns one of the values specified above:

    Sample Code 
                         
<html>
        <head>
                <script>
                        function btnClicked(btntype) {
                                if (btntype == 'continue') returnValue='DESKTOP'; 
                                if (btntype == 'new_win') returnValue='NEWWIN';
                                if (btntype == 'go_back') returnValue='CANCEL';
                                window.close();
                        }
                </script>
        </head>   
        <body>
                <br>You are about to navigate from the page that contains unsaved data. Click 'Continue' to discard the changes, 
                <br>'New Window' to preserve the changes and open the page in a new window, or 'Cancel' to stay on the page.</br>                   
                <table>
                        <td>      
                                <button type="button" id='continue' onClick="btnClicked('continue')">Continue</button>
                        </td>
                        <td>
                                <button type="button" id='new_win' onClick="btnClicked('new_win')">New Window</button>
                        </td>
                        <td>
                                <button type="button" id='go_back' onClick="btnClicked('go_back')">Cancel</button>
                        </td>
                </table>
        </body>   
</html>
  2. Build and deploy your application.
  3. Configure the following parameters of the EPCF service:

    workprotect.mode.layout = external

    workprotect.popup.external.url = myCompany.myPortalWorkProtectPopup (the name of your component)

    For more information, see Configuring the EPCF Service .