New version of RemoteList (IList implementation that support paging)

This is another post about implementation of remote list for Adobe Flex 2.

As I mentioned in previous post Flex framework provides ItemPendingError exception mechanism to use when collection data is not available. For example DataGrid component provides support for this exception. I didn't look too deeply in DataGrid code but my understanding that if ItemPendingError is thrown DataGrid would retry load the data by providing hooks into the ItemPendingError. I believe that all List based components should behave similary.

Given all these built-in support I realized it's much better to rely on ItemPendingError mechanism then event notification as I did in my previous post.

New version of RemoteList is based on old one with one exception - instead of dispatching CollectionEventKind.REPLACE to notifiy view (DataGrid), I throw ItemPendingException.

There are 3 main pieces:
IRemoteDataSet - interface that defines how to get remote data (RemoteDataSet a sample implementation)
RemoteList - class that uses IRemoteDataSet to get data and ItemPendingError mechanism to notify DataGrid when data is available
ItemPendingErrorEx - extends ItemPendingError to add dataReady/error methods.


I extended ItemPendingException by adding new method:

  public function dataReady(data:Object):void
  {
   if (responders)
   {
    responders.forEach(
     function(item:IResponder, index:int, arr:Array):void
     {
      item.result(data);    
     });
   }
  }

(I am somewhat surprised that similar method is not included by default)

This method iterates through all IResponders and notifies them when data is ready. IResponders would be added by DataGrid component so I don't need to do anything else here.

I also updated miss() method in the RemoteList class:

/**
   * Called when we need to load a new page of data and throws a new exception for first request or
   * rethrows already created exception if data loading already in progress.
   */
  public function miss(index:int):void
  {
   var item:Object = localData[index];
   if (item == null)
   {
    var page : Number = Math.floor(index / pageSize);
   
    if (pagesPending[page] == null)
    {
     remoteDataSet.loadData(page, pageSize);
    
     var loadingEvent:Event = new Event("Loading");
     dispatchEvent(loadingEvent);  
    
     var error:ItemPendingErrorEx = new ItemPendingErrorEx("Loading Data ...");
     pagesPending[page] = error;
     throw error;
    } else
    {
     throw pagesPending[page];
    }
   }
  }

The method would throw an ItemPendingErrorEx to let notify DataGrid that data is loading.

When data is ready onDataReady() method is called by RemoteDataSet class:

  public function onDataReady(loadedData:Object):void
  {
   var result:Array = loadedData.result[0]["value"].toArray();  
   var page:int = loadedData.result[1]["value"];
  
   var error:ItemPendingErrorEx = pagesPending[page];
  
   pagesLoaded[page] = true;
   var beginIdx : Number = page * pageSize;

   localData.splice.apply(localData, [beginIdx, result.length].concat(result));
  
   if (cleanData)
   {
    cleanInvisiblePages(page);
   }
  
   trace("localData is updated: " + beginIdx + "-" + (beginIdx + result.length) );              
  
   error.dataReady(result);
  
   if (isDataInit == false)
   {
    isDataInit = true;
    dispatchResetEvent(); // make columns are initialized
   }
  
   var dataReadyEvent:Event = new Event("DataReady");
   dispatchEvent(dataReadyEvent);
  }

Here ItemPendingErrorEx.dataReady method is called that in turn would call DataGrid's supplied listener to notify that data is ready and DataGrid can redraw the rows.

You can download all code from here.

(Still need to add support for sorting)