4 Replies Latest reply on Nov 4, 2007 9:24 AM by ntsiii

    Working with <mx:tree> and XML

    Edwardinho
      Hi there! I've been reading and googling for ages and I cannot find the solution to this problem, I want to load an xml into a <mx:tree> but i don't want to load all the xml structure. My xml look like this:
      <DataSet>
      <diffgr:diffgram>
      <NewDataSet>
      <Show>
      <uselessProperty>asdasd</uselessProperty>
      <uselessProperty1>asdasd</uselessProperty1>
      <uselessProperty2>asdasd</uselessProperty2>
      <uselessProperty3>asdasd</uselessProperty3>
      <Title>Title of the show</Title>
      <episodes>
      <episode1>
      <uselessProperty>asdasd</uselessProperty>
      <uselessProperty1>asdasd</uselessProperty1>
      <uselessProperty2>asdasd</uselessProperty2>
      <uselessProperty3>asdasd</uselessProperty3>
      <Title>Title of the show</Title>
      </episode1>
      <episode2>
      <uselessProperty>asdasd</uselessProperty>
      <uselessProperty1>asdasd</uselessProperty1>
      <uselessProperty2>asdasd</uselessProperty2>
      <uselessProperty3>asdasd</uselessProperty3>
      <Title>Title of the show</Title>
      </episode2>
      <episode3>
      <uselessProperty>asdasd</uselessProperty>
      <uselessProperty1>asdasd</uselessProperty1>
      <uselessProperty2>asdasd</uselessProperty2>
      <uselessProperty3>asdasd</uselessProperty3>
      <Title>Title of the episode</Title>
      </episode3>
      </episodes>
      </Show>
      <Show>
      <uselessProperty>asdasd</uselessProperty>
      <uselessProperty1>asdasd</uselessProperty1>
      <uselessProperty2>asdasd</uselessProperty2>
      <uselessProperty3>asdasd</uselessProperty3>
      <Title>Title of the show</Title>
      <episodes>
      <episode1>
      <uselessProperty>asdasd</uselessProperty>
      <uselessProperty1>asdasd</uselessProperty1>
      <uselessProperty2>asdasd</uselessProperty2>
      <uselessProperty3>asdasd</uselessProperty3>
      <Title>Title of the show</Title>
      </episode1>
      <episode2>
      <uselessProperty>asdasd</uselessProperty>
      <uselessProperty1>asdasd</uselessProperty1>
      <uselessProperty2>asdasd</uselessProperty2>
      <uselessProperty3>asdasd</uselessProperty3>
      <Title>Title of the show</Title>
      </episode2>
      <episode3>
      <uselessProperty>asdasd</uselessProperty>
      <uselessProperty1>asdasd</uselessProperty1>
      <uselessProperty2>asdasd</uselessProperty2>
      <uselessProperty3>asdasd</uselessProperty3>
      <Title>Title of the episode</Title>
      </episode3>
      </episodes>
      </Show>
      </NewDataSet>
      </diffgr:diffgram>
      </DataSet>

      I want to know if there is any way I can show the title of the show and the titles of the episodes as its children. By this time I've been just able to show the whole xml in the tree, but i just need those properties. I cannot find information about xml that doesn't have this format:

      <node property1="property" property1="property" property4="property" property3="property">
      <child property1="property" property1="property" property4="property" property3="property"/>
      <child property1="property" property1="property" property4="property" property3="property"/>
      <child property1="property" property1="property" property4="property" property3="property"/>
      </node>

      Please help me, my eyes will start bleeding if keep googling another nite.
        • 1. Re: Working with &lt;mx:tree&gt; and XML
          andrej770
          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="vertical"
          initialize="e4xService.send()">

          <mx:Script>
          <![CDATA[
          import mx.events.TreeEvent;
          import mx.rpc.events.ResultEvent;

          [Bindable]
          private var xmlData:XMLList;
          [Bindable]
          private var selectedXML:XML;

          private function resultHandler(event:ResultEvent):void
          {
          var result:XML = event.result as XML;
          xmlData = result..title as XMLList;
          }

          private function treeChangeHandler(event:Event):void
          {
          selectedXML = myTree.selectedItem as XML;
          var xmlName:String = selectedXML.name();
          while (xmlName != "title")
          {
          selectedXML = selectedXML.parent();
          xmlName = selectedXML.name();
          }
          }

          private function treeItemOpenHandler(event:TreeEvent):void
          {
          selectedXML = event.item as XML;
          myTree.selectedItem = selectedXML;
          }
          ]]>
          </mx:Script>

          <mx:HTTPService id="e4xService"
          url="assets/videoTitles.xml"
          result="resultHandler(event)"
          resultFormat="e4x"/>

          <mx:HBox width="800">
          <mx:Panel id="treePanel"
          title="Course Data" width="50%">
          <mx:Tree id="myTree"
          dataProvider="{xmlData}"
          labelField="@label"
          width="300"
          change="treeChangeHandler(event)"
          itemOpen="treeItemOpenHandler(event)"/>
          </mx:Panel>
          <mx:Panel width="50%"
          height="{treePanel.height}">
          <mx:Form>
          <mx:FormItem label="Course Name:">
          <mx:Label text="{selectedXML.@label}"/>
          </mx:FormItem>
          <mx:FormItem label="Duration:">
          <mx:Label text="{selectedXML.duration.@label}"/>
          </mx:FormItem>
          </mx:Form>
          </mx:Panel>
          </mx:HBox>

          </mx:Application>

          XML File:
          <?xml version="1.0"?>
          <titles>
          <title label="Flash User Experience Best Practices"
          software="Flash">
          <duration label="4.25 hours"/>
          </title>
          <title label="Flash Professional 8 New Features"
          software="Flash">
          <duration label="1.0 hours"/>
          </title>
          <title label="Flash Professional 8 Essential Training"
          software="Flash">
          <duration label="11.5 hours"/>
          </title>
          <title label="Flash Professional 8 Beyond the Basics"
          software="Flash">
          <duration label="10 hours"/>
          </title>
          <title label="Flash Professional 8 Video Integration"
          software="Flash">
          <duration label="7.25 hours"/>
          </title>
          <title label="Photoshop CS2 and Flash 8 Integration"
          software="Photoshop">
          <duration label="2.5 hours"/>
          </title>
          </titles>
          • 2. Re: Working with &lt;mx:tree&gt; and XML
            Venkat_79
            Hello,

            I am trying to search for a solution for my problem for the last couple of days wothout any luck.Surpisingly I wasn't able to find any thing related to "Dynamically Populating a tree in Flex from XML using HttpService - Java ". Hope you can help! Appreciate your time !


            This is the format of the XML that I get when I communicate to a Java Servlet,via HTTPService..

            <Parent id="Parent" name="Tester">
            <Child id="services" name="Services">
            <Leaf id="1" name="One"/>
            <Leaf id="2" name="Two"/>
            <Leaf id="3" name="Three"/>
            </Child>
            <AnotherChild id="4" name="Work">
            <AnotherLeaf id="111" name="1234"/>
            <AnotherLeaf id="222" name="abcdef"/>
            <AnotherLeaf id="333" name="xyz123"/>
            </AnotherChild>
            <LastChild id="ABC" name="ABC">
            <action id="q1" name="1"/>
            <action id="q2" name="2"/>
            <action id="q3" name="3"/>
            </LastChild>
            </Parent>


            I wanted to dynamically populate the tree using this xml and wanted to be able to do particular action when clicked on item, but I wasn't suseccful. This is the code snippet that I wrote,Can you please help me ?



            <?xml version="1.0"?>

            <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" creationComplete="getDetails.send();">

            <mx:HTTPService id="getDetails"
            url=" http://localhost:8080/FlexTest"
            result="dataResultHandler(event)"
            fault="dataFaultHandler(event)"
            resultFormat="e4x" />

            ***************************************************************************************** *********************************************

            <mx:Script>
            <![CDATA[
            import mx.collections.XMLListCollection;
            import mx.rpc.events.ResultEvent;
            import mx.rpc.events.FaultEvent;
            import mx.controls.Alert;


            [Bindable]private var result:XML;


            private function dataResultHandler(event:ResultEvent):void

            {
            var result:XML = event.result as XML

            }


            private function dataFaultHandler(event:FaultEvent):void

            {
            Alert.show(event.fault.message, "Could not load Data feed");
            }



            ]]>
            </mx:Script>

            ****************************************************************************************** ********************************************



            <mx:Tree width="100%" height="100%" id="tree1" dataProvider="{result}" labelField="@name" showRoot="true" />
            • 3. Re: Working with &lt;mx:tree&gt; and XML
              ntsiii Level 3
              Edwardinho , you have two options. One is to create a custom TreeDataDescriptor. I have not done this, nor have I see a simple example, but it would be the "preferred" solution.

              If I had to do this myself, and was under a time constraint, I would just use the xml from the data service to build a new xml structure that my tree could use directly.

              Tracy
              • 4. Re: Working with &lt;mx:tree&gt; and XML
                ntsiii Level 3
                Venkat_79, please do not "hijack" a thread for a different question. Start your own new question.
                Tracy