3 Replies Latest reply on Sep 25, 2009 5:55 AM by bigchip

    Changing States with selectedItem in tree

    bigchip

      I am using mx:tree with an XML file as the dataprovider.  I am populating several text areas and labels using the selectedItem in the tree which works perfectly.

       

      I would like to now have the state change to a different state based upon the "selectedItem" in the tree.  The code looks like this...

       

      <mx:XML id="charter" xmlns="" source="inception.xml" format="e4x" />   
          <mx:Canvas x="20" y="10" width="854" height="730" id="canvas1">
          <mx:Accordion x="9" y="61" width="214" height="518">
              <mx:Canvas label="Initiating" width="100%" height="100%">
                  <mx:Tree x="10" y="10" width="192" height="363" id="Inception"
                      dataProvider="{charter}" labelField="{['@category']}"
                      dropShadowColor="#030303" dropShadowEnabled="true"  wordWrap="true" variableRowHeight="true" itemClick="ChangeState()"/>
                  <mx:Button x="59" y="400" label="State Test" click="currentState='docHistory'"/>
              </mx:Canvas>
              <mx:Canvas label="Planning" width="100%" height="100%">
              </mx:Canvas>
          </mx:Accordion>
          <mx:TextArea text="{Inception.selectedItem.@description}"
              x="240" y="479" width="614" height="100"/>
          <mx:Label text="{Inception.selectedItem.@category}" 
              x="438" y="453" width="314" fontWeight="bold" fontSize="14" color="#F9FBFC" id="quickTip"/>
          <mx:Label x="354" y="453" text="Quick Tip:" fontSize="14" color="#F6F9FA" width="85" fontWeight="bold" id="qtip"/>
          <mx:Label x="240" y="61" text="Selected Item:" fontSize="14" fontWeight="bold" color="#F8FAFB"/>
          <mx:Label x="354" y="61" text="{Inception.selectedItem.@category}" width="356" fontSize="14" color="#F7FAFB" fontWeight="bold"/>
          <mx:RichTextEditor x="240" y="92" title="Text Input Area" width="614" height="333" id="richtexteditor1">
          </mx:RichTextEditor>
          <mx:Button x="495" y="433" label="Save To Project"/>
          </mx:Canvas>

       

      I had thought this would be easy but I have so far been able to find a solution.  I did put a button in above just to try changing states that way and it work fine.

       

      Any suggestions would be greatly appreciated.

       

      Ken

        • 1. Re: Changing States with selectedItem in tree
          babo_ya Level 3

          so are you saying that when you click this button <mx:Button x="59" y="400" label="State Test" click="currentState='docHistory'"/> the state does NOT change to 'docHistory'?

           

          BaBo,

          • 2. Re: Changing States with selectedItem in tree
            bigchip Level 1

            The button functionality works just fine.

             

            My question now is rather than using the button (which I'll remove once I get this solved), I want to be able to change to various stated based upon when a selectedItem in the tree is selected.  (i.e. the actual view state that the user sees will be based upon which item is selected in the tree rather than by using a button?

            • 3. Re: Changing States with selectedItem in tree
              bigchip Level 1

              I had beed struggling with this on and off for a while.  This is a real simple application and I found a real simple solution for my problem although I'm sure experienced developers would probably frown on the approach.

               

              I simply added a field called "design" in my xml flie that's used in my mx:tree and in the fields I put in the appropriate state that I wanted the application to render.

               

              I then just added . . . currentState="{Inception.selectedItem.@design}" to the very top level of the program.  It looks like this:

               

              <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="myProjinfo.send()" currentState="{Inception.selectedItem.@design}">

               

              Works perfectly.

               

              I'm sure if the application evolves into something a bit more complex I'll have to do something more sophisticated, but for now this will do.