This example shows how to use apex.storage.setCookie, apex.storage.getCookie and Dynamic Actions to save and reinstate the expansion state of an APEX Tree Region.
There is nothing special about the way the Tree region is set up except for the fact that it has a Static ID of empTree
To save the state of the tree before navigating away from the page (for any reason), create a Dynamic Action triggered on Page Unload and execute the following javascript:
// Get a handle on the tree using <>_tree. Then use the treeView to get the expanded Nodes
var exp$ = $("#empTree_tree").treeView("getExpandedNodeIds");
// Create a cookie and store the nodes that are expanded
// The toString will change the array into a comma separated string.
apex.storage.setCookie('myTreeState', exp$.toString());
To reinstate the tree to its previous state, create a Dynammic action on Page Load and execute the following javascript:
// Get a handle on the tree using <>_tree
var tree$ = $("#empTree_tree");
// Get the value of the cookie named myTreeState
var myTreeState = apex.storage.getCookie('myTreeState');
// If the Cookie isn't null then loop through and expand the tree
if (myTreeState)
{
// Split the value of the cookie and make an array
var $expNodes = myTreeState.split(',');
// Loop Through the array and for each entry
$expNodes.forEach(function (id) {
// Identify the Tree Nodes that relate to the saved values
var node$ = tree$.treeView('find',{
depth : -1,
findAll: false,
match: function(node){
return node.id == id
}
})
// Expand those nodes.
tree$.treeView('expand', node$)
})
}