Question

I'm new to Apache Flex. I need to write code to reading a CSV file of contents as shown below and populate it as table data in swf file using mxml and actionscript.

  1. How to reading CSV file?
  2. How to represent table in mxml, and loop through data in mxml?

1001,Vertical1,FN1001,MN1001,LN1001,Addr1001,City1001,State1001
1011,Vertical1,FN1011,MN1011,LN1011,Addr1011,City1011,State1011
1021,Vertical1,FN1021,MN1021,LN1021,Addr1021,City1021,State1021
1031,Vertical1,FN1031,MN1031,LN1031,Addr1031,City1031,State1031
1041,Vertical1,FN1041,MN1041,LN1041,Addr1041,City1041,State1041
Was it helpful?

Solution

Here is simple example how to display CSV data in flex. The code doesn't contain any failover functionality and it is just for illustration of the solution.

  1. Data is loaded via URLLoader in function loadData.
  2. Retrieved data is processed in function processData. It is split into rows. Each row is converted to array (again by split) and the result is pushed to output array, which is assigned as data provider of the grid. Grid has defined columns with data fields matching to indexes in the arrays converted from the rows.

    <mx:Application name="CSVTest" xmlns:mx="http://www.adobe.com/2006/mxml" applicationComplete="loadData();">
        <mx:Script><![CDATA[
        private var dataLoader:URLLoader;
    
        private function loadData():void {
            dataLoader = new URLLoader(new URLRequest("data.csv"));
            dataLoader.addEventListener(Event.COMPLETE, parseData);
        }
    
        private function parseData(event:Event):void {
            var output:Array = [];
            var input:String = dataLoader.data;
            var rows:Array = input.split("\n");
            for (var i:int = 0, len:int = rows.length; i < len; i++) {
                var row:Array = String(rows[i]).split(",");
                output.push(row);
            }
            grid.dataProvider = output;
        }
        ]]></mx:Script>
        <mx:DataGrid id="grid">
            <mx:columns>
                <mx:DataGridColumn dataField="0"/>
                <mx:DataGridColumn dataField="1"/>
                <mx:DataGridColumn dataField="2"/>
                <mx:DataGridColumn dataField="3"/>
                <mx:DataGridColumn dataField="4"/>
                <mx:DataGridColumn dataField="5"/>
                <mx:DataGridColumn dataField="6"/>
                <mx:DataGridColumn dataField="7"/>
            </mx:columns>
        </mx:DataGrid>
    </mx:Application>
    
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top