Somebody posted on a forum and asked “How do you get a mx:Tree to populate with query data from flex?” Most of the examples out there use xml in the mx:Tree so I did the same…

There are a few ways to get your query data to valid xml…

You can go to cflib.org and get a udf called QueryToXML and that is supposed to convert your query to valid xml… I’ve never used this, and personally I like writing my own because it gives me more control… and I like to know how things work. There are a couple of things you can do when you write your own…

1. Use the cfxml tag 2. Write out the xml yourself with concatenating strings.


1. Code

<cffunction name=“getSomeXML” output=“false” access=“remote” returntype=“string”> <cfset var getInfo = “”>
<cfset var xmlDoc= “”>

<cfquery name=“getInfo” datasource=“#someDSN#”>
SELECT *
FROM tblArtists
</cfquery>

<cfxml variable=“xmlDoc”>
<artists>
<cfloop query=“getInfo”>
<cfoutput>
<artist name=“#Artist#” id=“#id”/>
</cfoutput>
</cfloop>
</artists>
</cfxml>

<cfreturn xmldoc>

</cffunction>

2. Write your own

<cffunction name=“getSomeXml” output=“false” access=“remote” returntype=“string”> <cfset var getInfo= “”>
<cfset var xmldoc = “”>
<cfquery name=“getInfo” datasource=“#someDSN#”>
SELECT *
FROM tblArtists
</cfquery>

<!— =========== HEADER OF THE XML =========== —>
<CFSET xmldoc = “<?xml version=”“1.0”” encoding=”“UTF-8″“?>
<artists>
>
<cfloop query=“getAllMarkers”>
<cfoutput>

<cfset xmldoc = xmldoc &

<artist name=”“#Artist#”” id=”“#id”“/> “>
</cfoutput>
</cfloop>
<!— =========== FOOTER OF THE XML =========== —>
<cfset xmldoc = xmldoc &
</artists>

>

<cfreturn xmldoc>
</cffunction>

Notice in #2, I used “”#data#”” (a pair of double quotes surrounding variables) this concatenates the data appropriately and you get your xml back…

Why use one over the other you say? You may need more flexibility so you may have to write the string out… otherwise I would definitely start with the CFXML version, it’s much easier to understand.

Once in flex declare your var

[Bindable]
public var treeCollection:XML; /*
this function is called from the RemoteObject result=“treeReceived(event)”
*/

private function treeReceived(event:ResultEvent):void {
treeCollection = new XML(event.result);
}
<mx:Tree id=“someTree” dataProvider=“{treeCollection}” showRoot=“false”/>

I hope this blog might help someone…

CLICK HERE TO VIEW THE EXAMPLE