how to show grouped data in flex?

Question

<mx:XML id="inputData" > <Tulokset> <Tulos> <id>xx1</id> <group>xxx</group> </Tulos> <Tulos> <id>xx2</id> <group>xxx</group> </Tulos> <Tulos> <id>xx3</id> <group>yyy</group> </Tulos> </Tulokset> </mx:XML>

im trying to show on the app something like this without AdvancedDataGrid.

group xxx

<checkbox> id
<checkbox> id

group yyy

<checkbox> id
<checkbox> id
....

Answer 1

You can do this with a nested repeater and e4x. I don't know of a way in e4x to get the unique group names, but you can do it with an ActionScript wrapper function.

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

            private static function Unique(list:XMLList):XMLList 
            {
                var found:Object = new Object();
                var output:XML = <root />;

                for each(var node:XML in list) 
                {
                    var value:String = node.text().toString();
                    if (!found[value]) 
                    {
                        output.appendChild(node.copy());
                        found[value] = true;                    
                    }
                }
                return output.children();
            }
        ]]>
    </mx:Script>

    <mx:XML id="inputData" >  
        <Tulokset>  
            <Tulos>  
                <id>xx1</id>  
                <group>xxx</group>  
            </Tulos>  
            <Tulos>  
                <id>xx2</id>  
                <group>xxx</group>  
            </Tulos>  
            <Tulos>  
                <id>xx3</id>  
                <group>yyy</group>  
            </Tulos>  
        </Tulokset> 
    </mx:XML>

    <mx:Repeater id="groupRepeater" dataProvider="{Unique(inputData.Tulos.group)}">
        <mx:Label text="{groupRepeater.currentItem}" fontWeight="bold" />
        <mx:Repeater id="tulosRepeater" dataProvider="{inputData.Tulos.(group==groupRepeater.currentItem)}">
            <mx:Label text="{XML(tulosRepeater.currentItem).id}" />
        </mx:Repeater>
    </mx:Repeater>
</mx:Application>