Converting Array of Objects into Hierarchical XML Data

In this example I want to show you how to convert array of categories and subcategories into hierarchical XML data.











Launch Demo

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    layout="absolute" backgroundColor="#FFFFFF"
    backgroundGradientAlphas="1,1" viewSourceURL="srcview/index.html">
    <mx:Script>
        <![CDATA[
            import mx.collections.XMLListCollection;

            private var resultArray:Array =
                    new Array({label:'Category', category_id:'000', parentCategory_id:''},
                                {label:'Category1', category_id:'001', parentCategory_id:'002'},
                                {label:'Category2', category_id:'002', parentCategory_id:'000'},
                                {label:'Category3', category_id:'003', parentCategory_id:''},
                                {label:'Category4', category_id:'004', parentCategory_id:'010'},
                                {label:'Category5', category_id:'005', parentCategory_id:'006'},
                                {label:'Category6', category_id:'006', parentCategory_id:''},
                                {label:'Category7', category_id:'007', parentCategory_id:'002'},
                                {label:'Category8', category_id:'008', parentCategory_id:'003'},
                                {label:'Category9', category_id:'009', parentCategory_id:'003'},
                                {label:'Category10', category_id:'010', parentCategory_id:'000'});

            []
            private var treeData:XMLListCollection;

            private var rootNode:XML = <node/>;

            private function convertToXml():void
            {
                for(var i:int=0; i<resultArray.length; i++)
                {
                    var object:Object = resultArray[i];
                    if(object.parentCategory_id == '')
                    {
                        addNode(rootNode, object);
                        resultArray.splice(i, 1);
                    }
                }
                loopThroughObjects();
                treeData = new XMLListCollection(rootNode.children());
            } 

            private function addNode(root:XML, object:Object):void
            {
                var node:XML = <node/>;
                node.@category_id = object.category_id;
                node.@label = object.label;
                root.appendChild(node);
            } 

            private var i:int;
            private function loopThroughObjects():void
            {
                for(i=0; i<resultArray.length; i++)
                {
                    var object:Object = resultArray[i];
                    walk(rootNode, object);
                }
                trace(resultArray.length);
                if(resultArray.length != 0)
                    loopThroughObjects();
            } 

            private function walk(node:XML, object:Object):void
            {
                trace('parentCategory_id '+object.parentCategory_id);
                trace(node.toXMLString());
                if(node.@category_id == object.parentCategory_id)
                {
                    trace('add node object category_id'+object.category_id+', remove object');
                    addNode(node, object);
                    resultArray.splice(i, 1);
                    return;
                } 

                for each(var element:XML in node.elements())
                {
                    walk(element, object);
                }
            }
        ]]>
    </mx:Script> 

    <mx:List
        dataProvider="{resultArray}"
        labelField="label"
        width="176" height="250"
     x="10" y="10"/> 

    <mx:Button
        x="75" y="268"
        label="Convert to Xml"
        click="convertToXml()"
    /> 

    <mx:Tree
        dataProvider="{treeData}"
        x="194" y="10" height="250"
         width="171"
         labelField="@label"/>
</mx:Application>

Leave a comment