xml data binding question from a Flex 2 newbie
i attended flashforward conference in austin, , starting hooked on adobe flex 2. software developer, unfamiliar actionscript 3. have question data binding. understand basics of how work, running problem how populate tree component using data read in external xml file. want tree populated name attribute of <object> tag in xml in format of nested objects:
<object name="xxx1">
<property name="yy11" value="zz11"/>
<property name="yy12" value="zz12"/>
<property name="yy13" value="zz13"/>
</object>
<object name="xxx2">
<property name="yy21" value="zz21"/>
<property name="yy22" value="zz22"/>
<object name="xxx3">
<property name="yy31" value="zz31"/>
<property name="yy32" value="zz32"/>
<property name="yy33" value="zz33"/>
<object name="xxx4">
<property name="yy41" value="zz41"/>
<property name="yy42" value="zz42"/>
<property name="yy43" value="zz43"/>
<property name="yy44" value="zz44"/>
</object>
</object>
</object>
in addition, i'd display grid displays properties associated object selected in tree such propery name column header, , values displayed in grid. notice number of properties can vary per object, i'd need grid dynamic. i'm sure it's possible, bit stumped.
here's entire code far, i'm populating tree , grid using sample data rather actual input data file:
<!-- code starts here -->
<?xml version="1.0" encoding="utf-8"?>
<mx:application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute">
<mx:canvas width="100%" height="100%">
<mx:hdividedbox bottom="0" top="0" left="0" right="0" >
<mx:vbox id="treearea" height="100%" minwidth="200">
<mx:canvas label="tree view" width="100%" height="100%">
<mx:tree width="100%" height="100%" dataprovider="{treedata}" labelfield="@label"></mx:tree>
</mx:canvas>
</mx:vbox>
<mx:vbox id="dataarea" height="100%">
<mx:canvas label="properties" width="100%" height="100%" backgroundcolor="#ffffff">
<mx:text text="the grid below demo purposes only. have small bug populating real grid" />
<mx:datagrid id="dg" rowcount="5" dataprovider="{employees}" left="10" right="10" top="40" bottom="0">
<mx:columns>
<mx:datagridcolumn datafield="name" headertext="name"/>
<mx:datagridcolumn datafield="phone" headertext="phone"/>
<mx:datagridcolumn datafield="email" headertext="email"/>
</mx:columns>
</mx:datagrid>
</mx:canvas>
</mx:vbox>
</mx:hdividedbox>
</mx:canvas>
<mx:script>
<![cdata[
[bindable]
public var selectednode:object;
// event handler tree control change event.
public function treechanged(event:event):void {
selectednode=tree(event.target).selecteditem;
}
]]>
</mx:script>
<mx:httpservice id="inputxmlfile" url="data/xmlfile.xml" />
<!-- data comes in in format of:
<object name="xxx1">
<property name="yy11" value="zz11"/>
<property name="yy12" value="zz12"/>
<property name="yy13" value="zz13"/>
</object>
<object name="xxx2">
<property name="yy21" value="zz21"/>
<property name="yy22" value="zz22"/>
<property name="yy23" value="zz23"/>
<object name="xxx3">
<property name="yy31" value="zz31"/>
<property name="yy32" value="zz32"/>
<property name="yy33" value="zz33"/>
<object name="xxx4">
<property name="yy41" value="zz41"/>
<property name="yy42" value="zz42"/>
<property name="yy43" value="zz43"/>
</object>
</object>
</object>
-->
<!-- dummy data ui work -->
<mx:xmllist id="treedata">
<node label="mail box">
<node label="inbox">
<node label="marketing"/>
<node label="product management"/>
<node label="personal"/>
</node>
<node label="outbox">
<node label="professional"/>
<node label="personal"/>
</node>
<node label="spam"/>
<node label="sent"/>
</node>
</mx:xmllist>
<mx:xmllist id="employees">
<employee>
<name>christina coenraets</name>
<phone>555-219-2270</phone>
<email>ccoenraets@fictitious.com</email>
<active>true</active>
</employee>
<employee>
<name>joanne wall</name>
<phone>555-219-2012</phone>
<email>jwall@fictitious.com</email>
<active>true</active>
</employee>
<employee>
<name>maurice smith</name>
<phone>555-219-2012</phone>
<email>maurice@fictitious.com</email>
<active>false</active>
</employee>
<employee>
<name>mary jones</name>
<phone>555-219-2000</phone>
<email>mjones@fictitious.com</email>
<active>true</active>
</employee>
</mx:xmllist>
</mx:application>
<object name="xxx1">
<property name="yy11" value="zz11"/>
<property name="yy12" value="zz12"/>
<property name="yy13" value="zz13"/>
</object>
<object name="xxx2">
<property name="yy21" value="zz21"/>
<property name="yy22" value="zz22"/>
<object name="xxx3">
<property name="yy31" value="zz31"/>
<property name="yy32" value="zz32"/>
<property name="yy33" value="zz33"/>
<object name="xxx4">
<property name="yy41" value="zz41"/>
<property name="yy42" value="zz42"/>
<property name="yy43" value="zz43"/>
<property name="yy44" value="zz44"/>
</object>
</object>
</object>
in addition, i'd display grid displays properties associated object selected in tree such propery name column header, , values displayed in grid. notice number of properties can vary per object, i'd need grid dynamic. i'm sure it's possible, bit stumped.
here's entire code far, i'm populating tree , grid using sample data rather actual input data file:
<!-- code starts here -->
<?xml version="1.0" encoding="utf-8"?>
<mx:application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute">
<mx:canvas width="100%" height="100%">
<mx:hdividedbox bottom="0" top="0" left="0" right="0" >
<mx:vbox id="treearea" height="100%" minwidth="200">
<mx:canvas label="tree view" width="100%" height="100%">
<mx:tree width="100%" height="100%" dataprovider="{treedata}" labelfield="@label"></mx:tree>
</mx:canvas>
</mx:vbox>
<mx:vbox id="dataarea" height="100%">
<mx:canvas label="properties" width="100%" height="100%" backgroundcolor="#ffffff">
<mx:text text="the grid below demo purposes only. have small bug populating real grid" />
<mx:datagrid id="dg" rowcount="5" dataprovider="{employees}" left="10" right="10" top="40" bottom="0">
<mx:columns>
<mx:datagridcolumn datafield="name" headertext="name"/>
<mx:datagridcolumn datafield="phone" headertext="phone"/>
<mx:datagridcolumn datafield="email" headertext="email"/>
</mx:columns>
</mx:datagrid>
</mx:canvas>
</mx:vbox>
</mx:hdividedbox>
</mx:canvas>
<mx:script>
<![cdata[
[bindable]
public var selectednode:object;
// event handler tree control change event.
public function treechanged(event:event):void {
selectednode=tree(event.target).selecteditem;
}
]]>
</mx:script>
<mx:httpservice id="inputxmlfile" url="data/xmlfile.xml" />
<!-- data comes in in format of:
<object name="xxx1">
<property name="yy11" value="zz11"/>
<property name="yy12" value="zz12"/>
<property name="yy13" value="zz13"/>
</object>
<object name="xxx2">
<property name="yy21" value="zz21"/>
<property name="yy22" value="zz22"/>
<property name="yy23" value="zz23"/>
<object name="xxx3">
<property name="yy31" value="zz31"/>
<property name="yy32" value="zz32"/>
<property name="yy33" value="zz33"/>
<object name="xxx4">
<property name="yy41" value="zz41"/>
<property name="yy42" value="zz42"/>
<property name="yy43" value="zz43"/>
</object>
</object>
</object>
-->
<!-- dummy data ui work -->
<mx:xmllist id="treedata">
<node label="mail box">
<node label="inbox">
<node label="marketing"/>
<node label="product management"/>
<node label="personal"/>
</node>
<node label="outbox">
<node label="professional"/>
<node label="personal"/>
</node>
<node label="spam"/>
<node label="sent"/>
</node>
</mx:xmllist>
<mx:xmllist id="employees">
<employee>
<name>christina coenraets</name>
<phone>555-219-2270</phone>
<email>ccoenraets@fictitious.com</email>
<active>true</active>
</employee>
<employee>
<name>joanne wall</name>
<phone>555-219-2012</phone>
<email>jwall@fictitious.com</email>
<active>true</active>
</employee>
<employee>
<name>maurice smith</name>
<phone>555-219-2012</phone>
<email>maurice@fictitious.com</email>
<active>false</active>
</employee>
<employee>
<name>mary jones</name>
<phone>555-219-2000</phone>
<email>mjones@fictitious.com</email>
<active>true</active>
</employee>
</mx:xmllist>
</mx:application>
whay using different formatted xml dummy real data. using internal data testing fine technique, needs same format real data. otherwise how know when code right?
i have example uses httpservice xml file server, uses tree display/edit nodes, dynamic datagrid displaying/editing attributes, , httpservice send server. backend jsp, run you'd need j2ee web server tomcat, tree , property explorer might useful.
semd me email , send directly.
tracy
i have example uses httpservice xml file server, uses tree display/edit nodes, dynamic datagrid displaying/editing attributes, , httpservice send server. backend jsp, run you'd need j2ee web server tomcat, tree , property explorer might useful.
semd me email , send directly.
tracy
More discussions in Flex (Read Only)
adobe
Comments
Post a Comment