alekkus

Flex tutorial: Popup warning before browser closes

As the title implies, this post will show you how to ask for user confirmation before the browser window closes or navigated away from the current url.

We will make use of the onbeforeunload event in javascript. So first of all, you will need to insert the following into index.template.html.

<script language="JavaScript" type="text/javascript">
window.onbeforeunload = function()
{
	var swfApp = ${application};

	return swfApp.onCloseApplication();
}
</script>

The all you need is to add a callback function onCloseApplication in your main application (see codes below).

Demo:
Application Exit Warning (view source enabled)

Source Codes: main application

<?xml version="1.0" encoding="utf-8"?>
<mx:Application
	xmlns:mx="http://www.adobe.com/2006/mxml"
	layout="absolute"
	backgroundColor="#F8F8F8"
	creationComplete="onCreationComplete()">

<mx:Script>
<![CDATA[
	private function onCreationComplete() : void
	{
		if ( ExternalInterface.available )
		{
			ExternalInterface.addCallback( "onCloseApplication",
				function():String
				{
					if ( chkDisplayMessage.selected )
					{
						return txtMsg.text;
					}
					return null;
				} );
		}
	}
]]>
</mx:Script>

	<mx:CheckBox
		id="chkDisplayMessage"
		x="37" y="29"
		label="Display message upon application exit"/>

	<mx:Label x="37" y="59" text="Message:"/>

	<mx:TextInput
		id="txtMsg"
		x="104" y="57"
		text="Please don't close me."/>

	<mx:Label x="37" y="107" color="#666666" text="*Check on the above checkbox, then close/navigate away from the current url."/>
</mx:Application>

No Comments yet »

TrackBack URI

Leave a comment