If you have been developing web based applications which require login, I am pretty sure you would have come across this question – How do you safe-logout the user if the user just closes the window/tab when there is unsaved information on the user’s screen?
My current Flex project requires the user to login and logout. And most of the time, the users never use the logout button. They just close the browser and walk away!
So, I needed a mechanism which will warn the user that there is unsaved information before closing the window. The way, I got this working was by using the FABridge.
In the application, I had an isAppDirty boolean.
public var isAppDirty:Boolean = false;
This variable is set to true whenever there is unsaved information in the application from any view. Now, add a few lines of javascript to your html wrapper. You can do this to the html file in the html-template folder.
————————————————————————————-
window.onbeforeunload = confirmExit;
function confirmExit(){
var flexApp = FABridge.flash.root();
var appDirty = flexApp.isAppDirty();
// note that the isAppDirty var is called like a function. This is done deliberately. Thats the way FABridge works
if(appDirty == true){
return “The configuration changes performed in this session have not been saved. If you wish to save the config, please click CANCEL.”;
}
}
————————————————————————————-
Do not forget to include the FABridge libraries in the html -<script language=”JavaScript” type=”text/javascript” src=”bridge/FABridge.js”></script. You can download the FABridge libraries from here.
And you are set to go
. Quiet simple, isn’t it?



I had to do this recently as well. You can do this without including all of FABridge by using ExternalInterface directly. Here’s the setup code in AS:
try
{
ExternalInterface.addCallback(“hasUnsavedChanges”, hasUnsavedChanges);
}
catch(err:Error)
{
// ignore errors where ExternalInterface can’t be used, as we
// just always warn on exit then
}
(I left out the Javascript and the hasUnsavedChanges() method.)
Yup! That’s really important from usability POV. BTW! You can use JavaScript component (I wrote long back) to inject that JS code. That way you don’t need to modify html template everytime (except to include js files).
http://www.abdulqabiz.com/blog/archives/macromedia_flex/a_mxml_componen.php
Actually, you can load FABridge.js in Flex and inject entire code, but there is some bug in my code, once it’s fixed. JS files can be loaded via Flex and injected in HTML on runtime. Currently, simple files can be loaded and injected.
http://www.abdulqabiz.com/blog/archives/macromedia_flex/javascript_inje.php
-abdul
Hi,
So how can you call some internal flex method when user on event:
return “The configuration changes performed in this session have not been saved. If you wish to save the config, please click CANCEL.”;
clicks YES?
I mean, another method that can do logout on the FLEX side?