Flex AdvancedDataGrid caching records

Question

Hello,

I have an AdvancedDataGrid(ADG) bound to an ArrayCollection. ArrayCollection is populated from my Oracle database. Now, the records I have in the database are in millions and sometimes, based on the worst case criteria by the user, I can get around 10,000 records. Now, as this collection is bound to the ADG, it tries to render all the records at the same time and hence the application becomes sluggish.

What I need to know is, if there is any way to cache all the result from the database in the ArrayCollection and then render every 100 records based on the scrolling of the grid. That is, render only when it is needed to be shown. So, instead of querying the database for every 100 records, I need to render every 100 records when they are needed to be shown.

Is there any way to do like this?

Thanks :)

Answer 1

You can load your data to an ArrayCollection and then use another one to display the data (You could probably filter your original ArrayCollection to display just 100, but this is more straightforward).

<mx:ArrayCollection id="data">
...
</mx:ArrayCollection>

<mx:ArrayCollection id="display">
...
</mx:ArrayCollection>

<mx:VScrollBar id="bar" 
    minScrollPosition="0" 
    maxScrollPosition="1000000"
    scroll="onScroll(event);"/>

private function onScroll(event:ScrollEvent):void
{
    display.removeAll();
    var index:int = (bar.scrollPosition/bar.maxScrollPosition) * data.length;
    for(int i = 0; i < 100; i++)
    {
        display.addItem(data[i + index]);
    }
}

Be sure to have "display" as your ADG's dataProvider. If you want to be clever, there is probably a way to not have to remove all the elements from Display.