Flex Sychronizing map and datagrid interaction problem

TristanForward2

When I hover over a point on the map it is highlighted in the datagrid, but when I hoverover a point in the datagrid it does not highlight the point on the map. I believe something is wrong with my findGraphicByAttribute function, I have tried changing the if statement around but to no avail. Any suggestions?

Thanks.

This code was taken from the following site and modified.
http://blogs.esri.com/Dev/blogs/arcgisserver/archive/2009/02/19/Sychronizing-map-and-datagrid-interaction-with-the-ArcGIS-API-for-Flex.aspx

var results:ArrayCollection = new ArrayCollection;
          
          function onResult(featureSet:FeatureSet, token:Object = null):void
          {
           if (featureSet.features.length > 0)
           {
            for each (var myGraphic3:Graphic in featureSet.features)
            {
             //Adds a mouseover event for the graphic
             myGraphic3.addEventListener( MouseEvent.MOUSE_OVER, onMouseOver );
             myGraphic3.addEventListener( MouseEvent.MOUSE_OUT, onMouseOut );
             
             myGraphic3.symbol = resultsSymbol;
             myGraphicsLayer.add(myGraphic3);
             results.addItem(myGraphic3.attributes);
             map.addLayer(myGraphicsLayer);
             
             dg.visible = true;
             dg.dataProvider = results;
             
             function onMouseOver( event : MouseEvent ) : void
             {
              var graphic : Graphic = Graphic( event.target );
              graphic.symbol = highlightSymbol;
              
              for each( var attributes : Object in dg.dataProvider )
              {
               if (attributes === graphic.attributes)
               {
                dg.selectedIndex = (dg.dataProvider as ArrayCollection).getItemIndex(attributes)      
               }
              }          
              dg.scrollToIndex(dg.selectedIndex);
             }
             
             function onMouseOut( event : MouseEvent ) : void
             {                  
              Graphic( event.target ).symbol = resultsSymbol;            
              dg.selectedIndex = -1;     
             }
            
             function onItemRollOver( event : ListEvent ) : void
             {
              findGraphicByAttribute(event.itemRenderer.data).symbol = highlightSymbol;              
             }
             
             function onItemRollOut( event : ListEvent ) : void
             {
              findGraphicByAttribute(event.itemRenderer.data).symbol = resultsSymbol;
             }
             
             function findGraphicByAttribute( attributes : Object ) : Graphic
             {
              for each (var graphic:Graphic in myGraphicsLayer.graphicProvider)
              {
               if (graphic.attributes == attributes)
               {
                return graphic;
               }
              }
              return null;
             }
             
            }

           }

TristanForward2

@KenBuja OK so I was able to get it to run without errors using the code you provided.

I added
dg.addEventListener(ListEvent.ITEM_CLICK, dg_ItemRollOver, false, 0, true);
dg.addEventListener(ListEvent.ITEM_ROLL_OUT, dg_ItemRollOut, false, 0 ,true);
dg.addEventListener(ListEvent.ITEM_ROLL_OVER, dg_ItemRollOver, false, 0, true);

as well as the following code.

I think there is something wrong in my function findGraphicByAttribute(attributes:Object):Graphic but I'm not to sure.

The most frustrating thing is the first part of the code works (the mouse events) but not the second half... any thoughts would be most appreciated.

//Creates graphic for each point, adds attribute data for each point to array
          var results:ArrayCollection = new ArrayCollection;
          
          function onResult(featureSet:FeatureSet, token:Object = null):void
          {
           if (featureSet.features.length > 0)
           {
            for each (var myGraphic3:Graphic in featureSet.features)
            {
             //Adds a mouseover event for the graphic
             myGraphic3.addEventListener( MouseEvent.MOUSE_OVER, onMouseOver );
             myGraphic3.addEventListener( MouseEvent.MOUSE_OUT, onMouseOut );
             
             myGraphic3.symbol = resultsSymbol;
             myGraphicsLayer.add(myGraphic3);
             results.addItem(myGraphic3.attributes);
             map.addLayer(myGraphicsLayer);
             
             dg.visible = true;
             dg.dataProvider = results;
             
             function onMouseOver( event : MouseEvent ) : void
             {
              var graphic : Graphic = Graphic( event.target );
              graphic.symbol = highlightSymbol;
              
              for each( var attributes : Object in dg.dataProvider )
              {
               if (attributes === graphic.attributes)
               {
                dg.selectedIndex = (dg.dataProvider as ArrayCollection).getItemIndex(attributes)      
               }
              }          
              dg.scrollToIndex(dg.selectedIndex);
             }
             
             function onMouseOut( event : MouseEvent ) : void
             {                  
              Graphic( event.target ).symbol = resultsSymbol;            
              dg.selectedIndex = -1;     
             }
            
             function dg_ItemRollOut(event:ListEvent):void
             {
              findGraphicByAttribute(event.itemRenderer.data).symbol = resultsSymbol;
             }
             
             function dg_ItemRollOver(event:ListEvent):void
             {
              findGraphicByAttribute(event.itemRenderer.data).symbol = highlightSymbol;
             }
             
             function findGraphicByAttribute(attributes:Object):Graphic  
             {
              for each (var graphic:Graphic in myGraphicsLayer.graphicProvider)
             {
              if (graphic.attributes == attributes)
              {
               return graphic;
              }
             }
             return null;
             }
            }
             
            }