APEX

All -

I would like to have a warning pop up when a user attempts to navigate off a page that has unsaved data. I pulled the following off the forum but it dates from last year. The code shown below does not work on 3.1. Appreciate any comments or revisions:

----------------------------------------------------------------------------------------------------------------------

Thanks Vikas, this worked for me except for when I used the button template to do something other than Cancel or Save. When the button submits the page with a value of 'CLOSE_EVENT', for example, it displays the 'changes exist' message twice.

The double popup is avoided by using


setTimeout("enableCheck()", "100");



The requirement for setting onBeforeUnload="WarnSave();" in the onLoad attribute is avoided by putting the following in the javascript itself


window.onbeforeunload = WarnSave;



The full code is below.
This version also highlights all of the changed items on the page so that the user can see which items they changed.

Hope this is useful to someone!

Cheers
Richard



<script type="text/javascript">

function isFormChanged() {
var rtnVal = false;
var frm = document.wwv_flow;
var ele = frm.elements;
var bgCol = "#EEFFEE";

for ( idx=0; idx < ele.length; idx++ ) {
if ( ele[idx].type.length > 0 ) {
if ( isElementChanged( ele, idx ) ) {
ele[idx].style.background = bgCol;
rtnVal = true;
break;
}
}
}
return rtnVal;
}

function isElementChanged( ele, idx ) {
var isEleChanged = false;
var rtnVal = false;

switch ( ele[idx].type ) {
case "text" :
if ( ele[idx].value != ele[idx].defaultValue )
rtnVal = true;
break;

case "textarea" :
if ( ele[idx].value != ele[idx].defaultValue )
rtnVal = true;
break;

case "radio" :
val = "";
if ( ele[idx].checked != ele[idx].defaultChecked )
rtnVal = true;
break;

case "select-one" :
if (ele[idx].id>99 ) return false;
for ( var x =0 ; x <ele[idx].length; x++ ) {
if ( ele[idx].options[x].selected != ele[idx].options[x].defaultSelected )
rtnVal = true;
break;

case "select-multiple" :
if (ele[idx].id>99 ) return false;
for ( var x =0 ; x <ele[idx].length; x++ ) {
if ( ele[idx].options[x].selected != ele[idx].options[x].defaultSelected )
rtnVal = true;
}
break;

case "checkbox" :
if ( ele[idx].checked != ele[idx].defaultChecked )
rtnVal = true;
break;

default:
rtnVal = false;
break;
}
return rtnVal;
}

var g_saving = false;
var g_errmsg="There are unsaved changes on this page.";
g_errmsg += "\n- To save your changes, click Cancel and then click Apply Changes.";
g_errmsg += "\n- Click OK to discard your changes.";

var checkChangesEnabled = true;
window.onbeforeunload = WarnSave;

function WarnSave(){
var formChanged=isFormChanged();
if(!g_saving && checkChangesEnabled && formChanged){
event.returnValue = g_errmsg;
disableCheck();
}
}

function disableCheck(){
checkChangesEnabled = false;
setTimeout("enableCheck()", "100");
}

function enableCheck(){
checkChangesEnabled = true;
}

function doSave()
{
g_saving=true;
doSubmit('SAVE');
}

function doCancel()
{
g_saving = true;
doSubmit('CANCEL');
} Edited to change [ i ] to [idx] to avoid the forumchanging the code to italics

Richard.

Posts: 66
From: Glasgow
Registered: 12/23/98

Read Re: Tabular form - Warn before leaving page
Posted: Aug 3, 2007 8:23 AM in response to: Richard. in response to: Richard.
Click to reply to this thread Reply

To implement the above ...

1). put the script in your page HTML header or in javascript that's included in the page template. If you put it in the template but don't want the check to fire on every page then you will have to move the

window.onbeforeunload = WarnSave;

code to the page HTML Header or into the OnLoad attribute as

onBeforeUnload="WarnSave();"



2). on the Cancel button, set the Button Attributes to

onclick="doCancel();"



3). on the Apply Changes button, set the Button Attributes to

onclick="doSave();"



Job done!

NOTE: this will trap ANY navigation away from the page, including popup calendars, LOVs, Help text ...

... Does anyone know how to check the target URL value in the BeforeUnload event?