TreeGrid Version 2

The second version of the TreeGrid component is done. It is working much better thanks to comments from Matt and Jose. I was able to resolve all of the issues I was aware of except the hard coded reference to “product”. I was even able to get recursion working. I think I may have to eventually extend DataGrid so that I can add column sorting. Here are the changes I would still like to make to it:
– Column sorting is currently disabled. I would like to make it work… Maybe it would just sort top level nodes. What do you all think?
– Column resizing does not clip the disclosure icon correctly. The Label gets clipped right, but not the icon. Any ideas?
– Any other ideas to make this better?

Well here it is:

Here is the mxml code
Here is the cellRenderer code

Please let me know your comments and suggestions.


  • Brian O’Connor

    Tree Grid #2 – MXML Code Link doesn’t work…

  • James Ward

    Try to right click, then “Save Link As…” and let me know if that doesn’t work.

  • Itamar

    How can I set the item objects in a way so they will be pre-expanded when the gird is first shown.
    I tried to set each object to but that only changed the image and didn’t really expand the items. Or is there a way to programmatically open the items?

  • Itamar

    The commnets link say “comments (7)” while I can only see 3 – how come?

  • James Ward

    This blog software doesn’t show comments that have been marked as spam, but for some reason counts them… Strange.

    BTW: I will try to get back to you about your question in the next day or two.


  • Mohanraj

    First let me thank you for this wonderful sample.
    I have a grid that uses your TreeGrid cell renderer. This grid also has 2 more
    columns and these columns have a simple ImageRenderer attached to it.

    When I open the TreeRow in the grid, Child rows are
    displayed and the images in Stage1 and Stage2 of the
    child rows are displayed correctly.

    But when I close the TreeRow the child rows get closed
    but the images in the child rows still appear in the

    Whats causing these imgaes to stay in grid and how can it be removed?

    Also what would be your suggested modifications to TreeGrid Cell renderer If I had to populate the grid dynamically.


  • Agha Mehdi

    Excellent work. I just implemented it in Pre-Production mode of one of my internet apps and everyone at work loves it.

    There’s just one little thing. How can I make it so that users can also expand the tree by clicking on an item instead of just the arrow?

    Thanks again for such a great contribution.

  • Bart

    I tried to download the mxml file (also using ‘save target as’) but I get a .jsp file instead ?

  • Link

    The link is wrong in the page. You can right click and save:

  • James Ward

    The link is now fixed. Sorry.

  • Daniel

    I have a problem and don’t know how to fix it. I am pretty new to Flex and can use some help 101. here is the error that comes up when i try to compile and run the app.

    the error is on the following two lines:


    1 Cannot resolve attribute ‘cellRenderer’ for component type mx.controls.dataGridClasses.DataGridColumn. TreeGrid.mxml to del line 83 June 15, 2006 6:50:56 PM 39


    2 Cannot resolve attribute ‘columnName’ for component type mx.controls.dataGridClasses.DataGridColumn. TreeGrid.mxml to del line 83 June 15, 2006 6:50:56 PM 38

    please help i would really like to get this app going.

    thank you

  • James Ward

    It looks like you are trying to compile this in Flex 2. Unfortunately the TreeGrid currently only works with Flex 1.5.

  • satish

    Hey James,

    your sample works like a charm in flex 1.5, but doesnt work at all on flex 2.0. Are you planning anytime soon to write a sample for flex 2.0? Or if you have any ideas about it can you please share them here. I am planning to use datagrid and tree components together in flex 2.0 to achieve the result. Datagrid is the main component and tree as its hidden dataprovider. Does this approach make sense at all?

    thanks advance for your inputs.

  • James Ward

    This code hasn’t been updated for Flex 2. I would like to update it to work with Flex 2, just haven’t had the time yet. However, a similar approach to what I’ve done would probably work fine.


  • Manju

    I am trying to migrate the code to Flex 2.0, can you please advise what are equivalent classes for
    mx.controls.listclasses.SelectableRow and mx.controls.treeclasses.TreeRow.

  • enya

    Hi James,

    I havent been very successful in migrating your treegrid to flex 2.0. Can you please let me know if you have any plans on releasing a 2.0 version of your tree grid.


  • Yes, I’m interested too :)



  • Mike

    I have been looking for this for a while. Nice piece of work. It would be super if anyone was capable of migrating this to 2.0 (I didn’t succeed yet).

  • James Ward

    Hi all, I’m excited that so many people like this component. I’m sorry that I haven’t had time to update it to Flex 2. I just realized that when I moved to wordpress I lost the embedded demo of this thing. So in case anyone is interested, you can view the Tree Grid in action at:


  • latha


    I was finally able to convert the treeGrid code from flex 1.5 to flex 2.0 !

    Thanks to your code, it wasn’t as daunting a task as i had imagined. :)

  • Aya


    Could you please, send me the code for TreeGrid for flex2.


  • Manju

    Can you please send me code for TreeGrid for flex2.

  • Could you please send me the Flex 2 version of this code as well? Thanks!

  • Michal

    Does somebody know how to do it that by clinking on a button, or whatever else, will be all rows (levels) expanded and reversal??? thx