Datagrid itemrenderer fails - data interchanged between cells

Question

Hi,
I have the follwing datagrid, the 2nd column of which calls an itemrenderer...
<mx:DataGrid x="10" y="10" width="478" height="209" headerHeight="0" id="dgFollowUp"  verticalAlign="top" variableRowHeight="true" wordWrap="true" borderStyle="none" borderThickness="0" color="#000000" useRollOver="false" selectionColor="#FFFFFF">
        <mx:columns>
            <mx:DataGridColumn dataField="sel"  width="30"  textAlign="left"  sortable="false"   id="colsel" headerText="" >
                <mx:itemRenderer>
                    <mx:Component>
                        <mx:CheckBox paddingTop="2"  paddingLeft="10" selected="{data.sel}"
                            change="{data.sel = this.selected;}" click="parentDocument.changeIsSelectedStatus(this.selected, data)"/>
                    </mx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
            <mx:DataGridColumn headerText="" dataField="{data.FDOCNO_CONCAT}" itemRenderer="dgFollowupTextRenderer"/>
        </mx:columns>
    </mx:DataGrid>
...And here it is:
<?xml version="1.0"?>
<!-- itemRenderers\list\myComponents\RendererState.mxml -->
    <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()" height="100%">   
        <mx:Script>
            <![CDATA[
                import mx.states.SetProperty;
                import mx.controls.Text;
                import mx.controls.Label;
                import mx.managers.PopUpManager;
              private function init():void
                  var myLabel:Text = new Text;
                  var myText:String = data.FDOCNO_CONCAT;
                  var myLink:Label;
                  var myVboxIn:VBox;
                  myLabel.text = myText;                  
                  myLabel.width = 430;      
                  myVbox.addChild(myLabel);                
                  if (myText.length > 400)
                      myLink = new Label;
                      myLink.text = this.parentApplication.scn2LangXml.lastResult.followup.lblReadMore;
                      myLink.setStyle('color', 0x0000FF);
                      myLink.mouseChildren = false;
                      myLink.buttonMode = true;
                      myLink.useHandCursor = true;
                      myLink.addEventListener(MouseEvent.CLICK, callPopup);
                      myVbox.addChild(myLink);
              public function callPopup(event:Event):void
                var FollowUpDetailsPop:FollowUpDetails;            
                var count:Number = data.counter;
                var tmp:String = data.FDOCNO +' :\n'+data.DESCRIPTION + '\n' + data.COMMENTS;
                FollowUpDetailsPop = FollowUpDetails(PopUpManager.createPopUp(this, FollowUpDetails, true));
                PopUpManager.centerPopUp(FollowUpDetailsPop);        
                FollowUpDetailsPop.text = tmp;       
            ]]>
        </mx:Script>
        <mx:VBox id="myVbox" height="100%"/>
    </mx:VBox>
...And here is the popup:
<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute"
    width="400"
    height="300"
    showCloseButton="true"
    close="close()"
    title="{this.parentApplication.scn2LangXml.lastResult.followupdate.lblTitleDetails}"
    borderAlpha="1">
<mx:Script>
    <![CDATA[
        import mx.managers.PopUpManager;
        [Bindable] var text:String;
        private function close():void
             PopUpManager.removePopUp(this);
    ]]>
</mx:Script>
    <mx:TextArea id="txtDetails" text="{text}" x="10" y="10" width="360" height="240" editable="false"/>
</mx:TitleWindow>
...........Everything displays correctly and the popup functions well too.. The only problem is that when you scroll the initial datatagrid, you see data in the column, which calls the itemrenderer, being swapped between the rows. I have tried same on another example and 1) on sorting the column, the popup contains the wrong data and 2) if there are other columns, its only the one calling for itemrenderer which swaps data between its rows.
Any help | Many thanks..

Answer 1

Hi,
I have the follwing datagrid, the 2nd column of which calls an itemrenderer...
<mx:DataGrid x="10" y="10" width="478" height="209" headerHeight="0" id="dgFollowUp"  verticalAlign="top" variableRowHeight="true" wordWrap="true" borderStyle="none" borderThickness="0" color="#000000" useRollOver="false" selectionColor="#FFFFFF">
        <mx:columns>
            <mx:DataGridColumn dataField="sel"  width="30"  textAlign="left"  sortable="false"   id="colsel" headerText="" >
                <mx:itemRenderer>
                    <mx:Component>
                        <mx:CheckBox paddingTop="2"  paddingLeft="10" selected="{data.sel}"
                            change="{data.sel = this.selected;}" click="parentDocument.changeIsSelectedStatus(this.selected, data)"/>
                    </mx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
            <mx:DataGridColumn headerText="" dataField="{data.FDOCNO_CONCAT}" itemRenderer="dgFollowupTextRenderer"/>
        </mx:columns>
    </mx:DataGrid>
...And here it is:
<?xml version="1.0"?>
<!-- itemRenderers\list\myComponents\RendererState.mxml -->
    <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()" height="100%">   
        <mx:Script>
            <![CDATA[
                import mx.states.SetProperty;
                import mx.controls.Text;
                import mx.controls.Label;
                import mx.managers.PopUpManager;
              private function init():void
                  var myLabel:Text = new Text;
                  var myText:String = data.FDOCNO_CONCAT;
                  var myLink:Label;
                  var myVboxIn:VBox;
                  myLabel.text = myText;                  
                  myLabel.width = 430;      
                  myVbox.addChild(myLabel);                
                  if (myText.length > 400)
                      myLink = new Label;
                      myLink.text = this.parentApplication.scn2LangXml.lastResult.followup.lblReadMore;
                      myLink.setStyle('color', 0x0000FF);
                      myLink.mouseChildren = false;
                      myLink.buttonMode = true;
                      myLink.useHandCursor = true;
                      myLink.addEventListener(MouseEvent.CLICK, callPopup);
                      myVbox.addChild(myLink);
              public function callPopup(event:Event):void
                var FollowUpDetailsPop:FollowUpDetails;            
                var count:Number = data.counter;
                var tmp:String = data.FDOCNO +' :\n'+data.DESCRIPTION + '\n' + data.COMMENTS;
                FollowUpDetailsPop = FollowUpDetails(PopUpManager.createPopUp(this, FollowUpDetails, true));
                PopUpManager.centerPopUp(FollowUpDetailsPop);        
                FollowUpDetailsPop.text = tmp;       
            ]]>
        </mx:Script>
        <mx:VBox id="myVbox" height="100%"/>
    </mx:VBox>
...And here is the popup:
<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow
    xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute"
    width="400"
    height="300"
    showCloseButton="true"
    close="close()"
    title="{this.parentApplication.scn2LangXml.lastResult.followupdate.lblTitleDetails}"
    borderAlpha="1">
<mx:Script>
    <![CDATA[
        import mx.managers.PopUpManager;
        [Bindable] var text:String;
        private function close():void
             PopUpManager.removePopUp(this);
    ]]>
</mx:Script>
    <mx:TextArea id="txtDetails" text="{text}" x="10" y="10" width="360" height="240" editable="false"/>
</mx:TitleWindow>
...........Everything displays correctly and the popup functions well too.. The only problem is that when you scroll the initial datatagrid, you see data in the column, which calls the itemrenderer, being swapped between the rows. I have tried same on another example and 1) on sorting the column, the popup contains the wrong data and 2) if there are other columns, its only the one calling for itemrenderer which swaps data between its rows.
Any help | Many thanks..