XML related question in flex

My xml looks like this:

<node label=home>
  <node label="1.0" >
    <node label="1.1">
      <node label="1.1.1">
        <node label="1.1.1.1"/>
        <node label="1.1.1.2"/>
      </node>
      <node label="1.1.2"/>
      <node label="1.1.3"/>
    </node>
    <node label="1.2"/>
    <node label="1.3">
      <node label="1.3.1"/>
      <node label="1.3.2"/>
    </node>

  </node>
  <node label="2.0"/>
</node>

I have 4 columns in my datagrid.

1st col should ge开发者_运维知识库t only data which is as 1.0 and 2.0.

2nd col should get data as 1.1.

3rd col as 1.1.1.

4th col as 1.1.1.1,and so on.

Any idea how I can do this?

First of all, shouldn't the "2.0" node be on the same level as "1.0" node? (In your sample the "2.0" node is inside "1.0" node).

Second, I'm not sure if this is what you are looking for but try this sample application and let me know if it helps.

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                width="100%"
                height="100%">

    <mx:Script>
    <![CDATA[
        private function labelBuilder(item:Object, column:DataGridColumn):String {
            var ref:Object = this.deriveComplexColumnData(item, column.dataField);
            var label:String = "";
            for (var r:String in ref) {
                label += ref[r] + "; ";
            }
            return label;
        }

        private function deriveComplexColumnData(data:Object, dataField:String):Object {
            var currentRef:Object = data;
            var tokens:Array = dataField.split('.');
            if (tokens.length > 0) {
                for (var i:int = 0; i < tokens.length; i++)
                    currentRef = currentRef[tokens[i]];
            }
            return currentRef;
        }
        ]]>
    </mx:Script>

    <mx:XML id="xml">
        <node label="home">
            <node label="1.0">
                <node label="1.1">
                    <node label="1.1.1">
                        <node label="1.1.1.1"/>
                        <node label="1.1.1.2"/>
                    </node>
                    <node label="1.1.2"/>
                    <node label="1.1.3"/>
                </node>
                <node label="1.2"/>
                <node label="1.3">
                    <node label="1.3.1"/>
                    <node label="1.3.2"/>
                </node>
            </node>
            <node label="2.0"/>
        </node>
    </mx:XML>

    <mx:DataGrid id="dg" width="100%" height="100%" dataProvider="{xml.node}">
        <mx:columns>
            <mx:DataGridColumn dataField="@label" headerText="Node1"/>
            <mx:DataGridColumn dataField="node.@label" headerText="Node2"/>
            <mx:DataGridColumn dataField="node.node.@label" headerText="Node3"/>
            <mx:DataGridColumn dataField="node.node.node.@label" labelFunction="{ labelBuilder }" headerText="Node4"/>
        </mx:columns>
    </mx:DataGrid>

</mx:Application>

Note the "dataField" in each DataGridColum, each "node." represents 1 depth level inside the XML.

I've also added a labelBuilder method just to help you understand how the data is being processed and how you can change the way it is being rendered.

use formatters.....

<mx:Script>
    <![CDATA[

        // Event handler to format the input.            
        private function Format():void
        {
            // The format() method returns the formatted String,
            // or an empty String if there is an error.
            var formattedVal:String = numberFormatter.format(inputVal.text);

            if (formattedVal.length==0) {
                // If there is an error, the Format.error property 
                // contains the reason.
                formattedNumber.text=numberFormatter.error;
            }

            else {
                formattedNumber.text=formattedVal;
            }
        }
    ]]>
</mx:Script>

<mx:NumberFormatter id="numberFormatter"/>

<mx:Panel title="NumberFormatter Example" width="75%" height="75%" 
        paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">

    <mx:Form>
        <mx:FormItem label="Enter number - a letter is invalid:">
            <mx:TextInput id="inputVal" text="" width="75%"/>
        </mx:FormItem>

        <mx:FormItem label="Formatted number: ">
            <mx:TextInput id="formattedNumber" editable="false" width="75%"/>
        </mx:FormItem>

        <mx:FormItem>
            <mx:Button label="Validate and Format" click="Format();"/>
        </mx:FormItem>
    </mx:Form>

</mx:Panel>

i hope this will be good enough:-) you can get an idea from this and modify for ur requirement....cya!

You want to get those nodes into grid based on their level in xml - level N goes into column N. You can determine this level by counting parents until it's null:

public static function getNestLevel(node:XML):int {
    var level:int = 0;
    while (node.parent()) {
        level++;
        node = node.parent();
    }
    return level;
}

I think, you need to prepare data structure for you grid and put nodes there using their levels. You didn't say anything about rows. Do you want each row like 1.0 | 1.1 | 1.1.1 or each node on different row?