Oracle APEX Blog

Alternative Save Before Exit

Written by Matt Mulvaney | Mar 9, 2015 8:45:34 AM

Prompting the user to save before exiting the page is functionality that isn’t unusual for developers and users to request from an APEX application.

After a bit of googling you may find several developers talking about nifty ways of accomplishing this however here is a somewhat simpler alternative.

The main advantages of this solution is it’s simple and quite native to APEX using JavaScript without the need for plugins and it captures practically every area the user can leave the page (quitting the browser & back button excepted). It works by detecting changes to input fields so even changing values and then setting them back are considered a change.

First we need to create a Hidden Item to record that a change has occurred; you can add this to your current page (if it’s the only page being monitored) or on a Global Page. I’ll call mine P0_CHANGES:

Next we need to create a Dynamic Action on the Page you wish to monitor a Change on:

Next create a PL/SQL True Action

So what we’ve just created is a Dynamic Action which fires on change of an HTML input field; In the case of Items which don’t have a HTML input tag we can select them by class. In the above example select lists and text areas are selected by class (any other selections can be added to this list).

The Condition prevents the true action running for elements which have a property type of fieldset (associated with text areas), hidden fields (since we’re just capturing user input here) and any item with an attribute of monitor_changes set to N.

The monitor_changes attribute prevents the change of some fields being classified as a change. If you need this feature on any particular item, edit its properties and set.

HTML Form Element Attributes: monitor_changes=N

Next we need to protect all the exit points with a user choice of leaving the page or staying put on the current page.

To do this we need to add a bit of JavaScript to our page in the Function and Global Variable Declaration page level item:

So what this is doing is; if there were changes, it asks for user confirmation to stay or leave the page. If there weren’t any changes or the user confirms they want to leave the page, we change the browser window to a page or JavaScript command which is passed in as a variable.

In this next step we need to apply the function to all the points the user can navigate away from the page.

The home link in the Application Logo/Text is a little different; for this you have to edit the template (or create a new one as a copy). In the Body of the template, change this line

To this line

Because we are unable to add a URL target to Tabs we’ll need to make a similar template change; in the body of the template you need to find #TAB_CELLS# and replace it with the page source for that section (look for the

    tags in your page source) when the page is run. When replaced you can change the links on each tab to

(If you ever add new tabs, you’ll need to manually add them to the template)

If the user saves the page; then just set P0_CHANGES to N to prevent user confirmation when you navigate away from the page.

The confirmation message is a basic html “confirm” command, however to get it really looking nice you want to be using a modal dialog.

This is an excellent feature which you can learn about on our Advanced APEX course.

…and that’s it, a simple alternative save on exit

 

 

Author: Matt Mulvaney

Job Title: Senior Oracle APEX Development Consultant

Bio: Matt is an experienced APEX solution designer having designed numerous complex systems using a broad range of Oracle Technologies. Building on his previous experience of Oracle Forms & PL/SQL, he is entirely focused on providing functionally rich APEX solutions. Matt promotes APEX as a software platform and openly shares best practises, techniques & approaches. Matt has a passion for excellence and enjoys producing high quality software solutions which provide a real business benefit.