Question

I had done hierarchical datagrid with item renderer. everything is working fine. i had lot of data to display in the grid, so the scrollbar is displaying every time when the data loads. when drag the scroll bar, the item renderer is not working properly and few of the data columns data is missing .can i know how to resolve the issue.

find the image here Image click

please check the below code:-
`

width=”100%” height=”100%”
textAlign=”center” autoDrawBackground=”false”>

<fx:Script>
    <![CDATA[
        import com.hp.pmm.common.ImageLibrary;

        import mx.collections.ArrayCollection;
        import mx.controls.Alert;
        import mx.resources.ResourceManager;
        private var _data:Object;           

        override public function set data(value:Object):void
        {               
            super.data = value;
            var showButton:String= '';
            var i:int=0;
            var j:int=0;

            var showDataForChildren:String;

            if(value.hasOwnProperty("Data_Transfer")) 
            {               
                showButton = value.Data_Transfer;

                if (showButton == "Show_Button") {

                    startId.visible= true;
                    startId.includeInLayout= true;
                    abortId.visible= true;
                    abortId.includeInLayout= true;
                    imgStatus.visible=false;
                    lblStatus.visible= false;
                    imgStatus.includeInLayout= false;
                    lblStatus.includeInLayout= false;
                }else {
                    lblStatus.text = "--";
                    startId.visible= false;
                    abortId.visible= false;
                    startId.includeInLayout= false;
                    abortId.includeInLayout= false;
                    imgStatus.includeInLayout= true;
                    lblStatus.includeInLayout= true;

                }

            }
        }


        public function clickedOnStart(event:Event):void{

            var startEvent:Event = new Event("clickOnStartButton");
            var parent:EventDispatcher = parentDocument.parentDocument as EventDispatcher;
            if (parent != null)
            {
                parent.dispatchEvent(startEvent);
            }
        } 


        public function clickedOnAbort(event:Event):void{

            var abortEvent:Event = new Event("clickOnAbortButton");
            var parent:EventDispatcher = parentDocument.parentDocument as EventDispatcher;
            if (parent != null)
            {
                parent.dispatchEvent(abortEvent);
            }
        } 


    ]]>
</fx:Script>

<s:HGroup width="100%" gap="5" verticalAlign="middle" horizontalAlign="left" height="100%">
    <!--<mx:Image id="imgStatus"/>
    <mx:Label id="lblStatus" textAlign="left" showTruncationTip="true"  paddingTop="3"/>-->
    <s:HGroup verticalAlign="middle" horizontalAlign="center">              
        <mx:Button label="Start" id="startId" click="clickedOnStart(event)" width="40"  height="20"/>
        <mx:Button label="Abort" id="abortId" click="clickedOnAbort(event)" width="40"  height="20"/>
    </s:HGroup>
    <s:HGroup height="100%">    
            <mx:Image id="imgStatus"/>
            <mx:Label id="lblStatus" textAlign="left" showTruncationTip="true"  paddingTop="3" />
    </s:HGroup>


</s:HGroup>

`

Answer 1

Without seeing any of your code, I am going to guess that it is an issue with how item renderer’s work. They get recycled and have caused me problems in the past as well. I am willing to bet that your data is displayed properly when it fist loads and doesn’t start to mess up until you start to scroll.

Take a look at the results from this Google search:

https://www.google.com/search?q=flex+spark+datagrid+virtual+layout&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:en-US:official&client=firefox-a#hl=en&client=firefox-a&hs=L4Y&rls=org.mozilla:en-US%3Aofficial&sclient=psy-ab&q=flex+datagrid+itemrenderer+recycling&oq=flex+datagrid+itemrenderer+rec&aq=0A&aqi=q-A1&aql=&gs_l=serp.3.0.33i29.347849.348490.2.350175.3.3.0.0.0.0.266.752.2-3.3.0…0.0.ULkB2IYzfzs&pbx=1&bav=on.2,or.r_gc.r_pw.r_cp.r_qf.,cf.osb&fp=fc4777bf82d127e8&biw=1600&bih=979

Edit:
Added below code in response to sample code provided

        if(value.hasOwnProperty("Data_Transfer")) 
        {               
            showButton = value.Data_Transfer;

            if (showButton == "Show_Button") {

                startId.visible= true;
                startId.includeInLayout= true;
                abortId.visible= true;
                abortId.includeInLayout= true;
                imgStatus.visible=false;
                lblStatus.visible= false;
                imgStatus.includeInLayout= false;
                lblStatus.includeInLayout= false;
            }else {
                lblStatus.text = "--";
                startId.visible= false;
                abortId.visible= false;
                startId.includeInLayout= false;
                abortId.includeInLayout= false;
                imgStatus.includeInLayout= true;
                lblStatus.includeInLayout= true;

            }

        }
        else
        {
            //set all values to your equivalent of no data
        }