Creating a TreeGrid with sortable columns

Question

I'd like to put a TreeGrid in my application so that the columns can be sorted. If you refer to this sample application, you'll notice that if you

1. Open a branch node
2. Sort by one of the columns
3. Close that branch node

then the TreeGrid starts to get out of wack and duplicate columns start appearing and other columns start disappearing. What I would like is to have the columns sorted only by the outermost nodes.

One attempt I had was to run treeGrid.closeAllItems() before the sort occurred. However, this does not work, because a Sort Column event gets dispatched while closeAllItems is running, so the list gets messed up and listOutOfBounds exceptions get thrown.

Has anyone had any success with this, or have any ideas?

Answer 1

Here is a piece of working code

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">

<mx:Script>
    <![CDATA[
     import mx.collections.HierarchicalData;

    ]]>
</mx:Script>

   <mx:XMLList id="dataProviderXMLList">
        <node id="1" name="Companies" type="COMPANIES" desc="All Companies" statusIcon="statusIcon">
      <node id="2" name="Adobe" type="COMPANY" desc="Adobe inc." statusIcon="statusIcon">
       <node id="5" name="Adobe Consulting" type="COMPANY" desc="Adobe (formerly macromedia)" statusIcon="statusIcon" />
       <node id="6" name="EDBU" type="COMPANY" desc="Database company" statusIcon="statusIcon" />
      </node>
      <node id="3" name="Macromedia" type="COMPANY" desc="Adobe (formerly macromedia)" statusIcon="statusIcon" />
      <node id="4" name="Oracle" type="COMPANY" desc="Database company" statusIcon="statusIcon" />
     </node>   
    </mx:XMLList>

    <mx:AdvancedDataGrid width="100%" height="100%" sortExpertMode="true" id="adg1" designViewDataType="tree" dataProvider="{new HierarchicalData(dataProviderXMLList)}">
     <mx:columns>
      <mx:AdvancedDataGridColumn headerText="Companies" dataField="@name"/>
      <mx:AdvancedDataGridColumn headerText="COMPANIES" dataField="@type"/>
      <mx:AdvancedDataGridColumn headerText="All Companies" dataField="@desc"/>
     </mx:columns>
    </mx:AdvancedDataGrid>

</mx:Application>

Bu this is using AdvancedDataGrid and it works perfectly fine.