[flexcoders] DataGrid updating weirdness

[cjsutherland]

Hi All,

I'm still pretty new at this so this is probably elementary for most
of you, but I can't figure this problem out.

I have a DataGrid (with custom item renderers) populated by an Array
Collection, which is gathered from an external XML file.  The initial
load-in of the data works great.

I also have a timer set so that every 5 seconds the data is reloaded
into the Array Collection, and the DataGrid should be updated.

But when the data is reloaded, even though the data hasn't changed,
Flex doesn't update the DataGrid properly.

See:
http://infax.com/cjwork/rec/main.html

There should be no "movement" of the data items, but there ya go. 
Also, if I *do* happen to change the data in the XML file, the data
grid doesn't show the changes.  I'm stumped.

Here's the code of the component:

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml";
creationComplete="initApp();" width="1280"    height="768">

       <mx:Script>
       <![CDATA[

           import mx.rpc.http.HTTPService;
           import mx.rpc.events.ResultEvent;
           import mx.collections.ArrayCollection;

           public var myService:HTTPService         = new HTTPService();
           public var myTimer:Timer                = new Timer(5000);

           [Bindable]
           public var myData:ArrayCollection;


           public function initApp():void {
               myService.addEventListener("result", httpResult);
                  myService.url = "assets/fids.xml";
               myService.send();

               myTimer.addEventListener(TimerEvent.TIMER, refreshData)
               myTimer.start();
           }

           public function httpResult(event:ResultEvent):void {
               myData = event.result.fids.record;
           }

           public function refreshData(event:TimerEvent):void {
               myService.send();
           }

       ]]>
   </mx:Script>

   <mx:Image x="0" y="0" source="assets/yellowBG.jpg" width="1280"
height="768" id="background"/>

   <mx:DataGrid dataProvider="{myData}" id="grid1" x="25" y="25"
rowHeight="50" >
       <mx:columns>
           <mx:DataGridColumn id="cityName" dataField="cityName"
headerText="City" itemRenderer="Comp_DataGridCityName" />
           <mx:DataGridColumn dataField="airlineCode"
headerText="Airline" itemRenderer="Comp_DataGridAirlineLogo"
width="225"/>
           <mx:DataGridColumn dataField="flightNumber"
headerText="Flight" itemRenderer="Comp_DataGridFlightNumber"/>
       </mx:columns>
   </mx:DataGrid>

</mx:Canvas>

Any help would be much appreciated!