title: Binding the selected item from DataGroup (dataprovider is an XML list) to another component (FLEX 4)
body: <p>Good day to everyone!  </p>
  
  <p>I have a DataGroup featuring thumbnails that it gets from XML list passed into an ArrayCollection. I also have a custom item renderer for the datagroup. What I can't make to work is the following: when an thumbnail in the datagroup is clicked the state changed to the page with the information about the projects.  </p>
  
  <p>I have the information in the same XML file. I need to bind the source of richtext and several label components to the selected item from the datagroup with a different property of the project from XML list. It it were a simple List component, I would have done it the following way:
  <strong>for the list</strong><br>
      id="myList" dataProvider="{myProjects.Project}" 
  <strong>for the label</strong>
      text="{myList.selectedItem.textexample}"</p>
  
  <p><strong>The code I have for the DataGroup</strong>: </p>
  
  <pre><code>&lt;s:DataGroup includeIn="ThumbnailList" dataProvider="{myList}" alpha="0.72" 
  blendMode="luminosity" buttonMode="true" id="myThumbs" 
  clipAndEnableScrolling="true" height="187" 
  itemRenderer="components.CustomRenderer4Thumbs" 
  d:userLabel="hos_RepeatedItem" width="320" x="110" y="2" /&gt;
  </code></pre>
  
  <p><strong>The code for the renderer:</strong> 
      
  </p>
  
  <pre><code>&lt;fx:Script&gt;
      &lt;![CDATA[
          [Bindable] public var counter:Number=0;
          protected function image1_clickHandler(event:MouseEvent):void
          {
              if(counter==0)
              {
              this.currentState="selected";
              moveIn.play([offsets]);
              counter=1;
              }
              else if(counter==1)
              {
              mx.core.FlexGlobals.topLevelApplication.currentState="DescriptionPagefromThumbs";
              counter=0;
              }
          }
      ]]&gt;
  &lt;/fx:Script&gt;
  &lt;fx:Declarations&gt;
      &lt;s:Animate id="Larger"  duration="250"&gt;     
          &lt;s:motionPaths&gt;
              &lt;s:SimpleMotionPath property="height" valueFrom="50" valueTo="100" /&gt;   
              &lt;s:SimpleMotionPath property="width" valueFrom="50" valueTo="100" /&gt;    
          &lt;/s:motionPaths&gt;
      &lt;/s:Animate&gt;
      &lt;s:Animate id="moveIn" target="{offsets}" duration="650"&gt;
          &lt;s:SimpleMotionPath property="scaleX" /&gt;
          &lt;s:SimpleMotionPath property="scaleY" /&gt;
          &lt;s:SimpleMotionPath property="x" /&gt;
          &lt;s:SimpleMotionPath property="y" /&gt;
      &lt;/s:Animate&gt;
  &lt;/fx:Declarations&gt;
  &lt;s:states&gt;
      &lt;s:State name="normal"/&gt;
      &lt;s:State name="hovered"/&gt;
      &lt;s:State name="selected"/&gt;
  &lt;/s:states&gt;  
  &lt;mx:Image height.hovered="50" click="image1_clickHandler(event)" id="image1" maintainAspectRatio="true" smoothBitmapContent="true" source="{data.Thumb}" d:userLabel="hos_RepeatedItemTH" width.hovered="50" x="0" y="0"/&gt;
  </code></pre>
  
  <p></p>
  
  <p>XML List contains Projects that have at least Title, Thumb, and textexample each.</p>
  
  <p>I would appreciate any help!</p>