Flex Solutions: Essential Techniques for Flex 2 and 3 Developers

<?xml version="1.0" encoding="utf-8"?>
<!--
////////////////////////////////////////////////////////////////////////////////
// Flex Solutions: Essential Techniques for Flex 2 and Flex 3 Developers
// Author: Marco Casario 
// Editor: FriendsOfED www.friendsofed.com
// All Rights Reserved.
//
// Chapter 13: User Navigation in Flex Applications
// 
// Solution 13-5: Moving within a Tree control using E4X
//
// 
// @author      Marco Casario
// @date        26 November 2007
// @version     1.0
// @site        flexsolutions.comtaste.com
//
////////////////////////////////////////////////////////////////////////////////
-->
 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle">
 
    <mx:Script>
    	<![CDATA[
			import mx.controls.Alert;
		 	import mx.collections.XMLListCollection;
 
		 	[Bindable]
			private var searchResult:XMLList;
			private var searchResultIndex:uint = 0;
 
		  	/**
		  	 * Find by attribute @name
		  	 */
			private function findByName(event:MouseEvent):void
			{
				// get search string:
				var searchStr:String = searchNameInput.text;
			    if (searchStr.length == 0) {             
			        Alert.show("Provide a search string.");
			        return;
			    }
 
			    // collapse tree:
			    tree.expandChildrenOf(data[0], false);
 
			    // search matching XML nodes:
			    searchResult = data.node.node.(@name.toLowerCase().search(searchStr.toLowerCase()) > -1);
			    searchResultIndex = 0;
				findNextBut.enabled = true;
 
				// expand tree:
			    if (searchResult[searchResultIndex] != undefined)
			        expandNode(searchResult[searchResultIndex]);
			}
 
			/**
			 * Shows other found nodes:
			 */
			private function findNext(event:MouseEvent):void
			{
			    // collapse tree:
			    tree.expandChildrenOf(data[searchResultIndex], false);
			    // search forward:
			    searchResultIndex += 1;
 
			    if (searchResult[searchResultIndex] != undefined)
			        expandNode(searchResult[searchResultIndex]);
			}
 
			/**
			 * Expands a node in the current tree.
			 */
			private function expandNode(xmlNode:XML):void
			{
				while (xmlNode.parent() != null) {
					xmlNode = xmlNode.parent();
					tree.expandItem(xmlNode, true, false);
					tree.selectedItem = searchResult[searchResultIndex];
				}
			}
		]]>
	</mx:Script>
 
	<mx:XMLList id="data">
		<node>
			<node name="YouThru.com">
				<node name="Emanuele"
					surname="Tatti" age="23" wage="1200"/>
				<node name="Francesco" 
					surname="Rapana " age="22" wage="1000"/>
				<node name="Constantin"
					 surname="Moldovanu" age="23" wage="1200"/>
					 	<node name="Marco" 
					surname="Casario" age="29" wage="1500"/>
			</node>
			<node name="Acme spa">
				<node name="John"
					surname="Doe" age="32" wage="900"/>
				<node name="Max" 
					surname="Power" age="28" wage="1500"/>
				<node name="Homer" 
					surname="Simpsons" age="48" wage="200"/>
			</node>
			<node name="Comtaste Corp.">
				<node name="Marco" 
					surname="Casario" age="29" wage="1500"/>
				<node name="Raffaele" 
					surname="Mannella" age="45" wage="1500"/>
				<node name="Liviu" 
					surname="Stoica" age="25" wage="1300"/>
			</node>
		</node>
	</mx:XMLList>
 
	<mx:Panel title="Tree Search" height="100%" width="100%">
		<mx:HBox width="100%">
			<mx:TextInput id="searchNameInput" />
			<mx:Button label="Search by name" click="findByName(event)" />  
			<mx:Button id="findNextBut" label="Find Next" click="findNext(event)" enabled="false" />
		</mx:HBox>
 
		<mx:Tree id="tree" width="100%" height="100%" 
			showRoot="false" dataProvider="{data}" 
			labelField="@name" />
    </mx:Panel>
 
</mx:Application>