Flex TabNavigator and Browser Refresh

I posted last week about the forward/back browser buttons and how Flex has built-in support to handle them. I also mentioned that I would follow up with a quick fix for handling the browser refresh problem. The basic approach is to use a SharedObject (aka Flash Cookie) to store the currently selected tab and restore the last selected tab when the page is refreshed. You can see an example by clicking here. Be sure to click around and then refresh the page.

Whenever a tab is selected, the index of the selection is written to the SharedObject. The handleTabChange method is called and writes the selected index to the SharedObject. Whenever the page is refreshed the application checks for the existence of the index variable in the SharedObject and then sets the last viewed tab. The code looks like:

</p> <p> function restoreSelectedTab()<br /> {<br /> var so = SharedObject.getLocal(“cookie”);<br /> tabNavigator.selectedIndex = so.data.index;<br /> }</p> <p> function handleTabChange(event)<br /> {<br /> var so = SharedObject.getLocal(“cookie”);<br /> if(event.newValue > 0)<br /> so.data.index = event.newValue;<br /> so.flush();<br /> }</p> <p>

I’ll continue to extend this example in the coming weeks.