[flexcoders] itemRenderer not updating

[securenetfreedom]

I have custom item render in a datagrid that is exhibiting 
unpredictable behavior. It does not update when scrolling the 
datagrid. Other times it does update, and other times it updates but 
on the wrong row. 

Here's the component:

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"; 
         horizontalScrollPolicy="off" verticalScrollPolicy="off"
         creationComplete="setItems();" >
        <mx:Script>
        <![CDATA[
        [Bindable]
        private var pct:Number;
        [Bindable]
        private var pct_str:String;
                        
        [Embed(source="assets/flag_red.png")]
            [Bindable]
            public var red:Class;  
                                    
        [Embed(source="assets/flag_green.png")]
            [Bindable]
            public var green:Class;
                                       
        private function setItems():void{
// checking for data=null is neccessary since grid is created 
// before dataprovider is populated via webservice
          if(data != null){                     
                trace('data.Pct:'+ data.Pct);
                pct = Number(data.Pct);
                if(pct <=85) img.source = green;        
                if(pct  > 85) img.source = red;
                pct_str = renderPercentText(String(data.Pct));
                this.updateDisplayList(this.unscaledWidth, 
this.unscaledHeight);                   
          }
        }
            
        private function renderPercentText(t:String):String {   
                return String(percentFormatShort.format(t))+"%";
        }
        // :: for testing only ::
        // this click handler will render the cell correctly the 
image is clicked 
        private function setImg(e:Event):void{
                setItems();
        }
                        
        ]]>
        </mx:Script>    
        <mx:NumberFormatter id="percentFormatShort" precision="0" />
        <mx:Image id="img" width="16" height="16"  right="0" 
click="setImg(event)" />
        <mx:Text id="txt" text="{pct_str}" textAlign="right" 
width="44" />
</mx:HBox>


Thanks for your help.

-Jeff