Sorting a DataGrid on multiple columns

        
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    initialize="initDP();" width="550" height="400">
    <mx:Script>
        
        import mx.events.DataGridEvent;
        import mx.collections.*;
        private var myDPColl:ArrayCollection;
        
        [Bindable]
        private var sortA:Sort;
        private var sortByColumn1:SortField;
        private var sortByColumn2:SortField;
        private var sortByColumn3:SortField;
        private var myDP:Array = [{Column1:'A', Column2:'AA',Column3:11.99, Column4: true},
                                  {Column1:'B', Column2:'BB',Column3:10.99, Column4: false},
                                  {Column1:'C', Column2:'CC',Column3:12.99, Column4: true},
                                  {Column1:'D', Column2:'VV',Column3:11.99, Column4: false},
                                  {Column1:'E', Column2:'EE',Column3:11.99, Column4: true},
                                  {Column1:'F', Column2:'FF',Column3:14.99, Column4: true},
                                  {Column1:'G', Column2:'GG',Column3:5.99,  Column4: true}
        ];
        private function initDP():void {
            myDPColl = new ArrayCollection(myDP);
            sortA = new Sort();
            sortByColumn1 = new SortField("Column1", true, true);
            sortByColumn2 = new SortField("Column2", true);
            sortByColumn3 = new SortField("Column3", true);
            sortA.fields=[sortByColumn1, sortByColumn2];
            myDPColl.sort=sortA;
            myDPColl.refresh();
            myGrid.dataProvider = myDPColl;
            myGrid.rowCount = myDPColl.length +1;
        }
        private function headRelEvt(event:DataGridEvent):void {
            sortA.fields[2] = sortA.fields[1];
            sortA.fields[1] = sortA.fields[0];
            if (event.columnIndex==0) {
                sortA.fields[0] = sortByColumn1;
            } else if (event.columnIndex==1) {
                sortA.fields[0] = sortByColumn2;
            } else {
                sortA.fields[0] = sortByColumn3;}
                myDPColl.sort = sortA;
                myDPColl.refresh();
                event.preventDefault();
        }
      
    </mx:Script>
    <mx:DataGrid id="myGrid" width="100%" headerRelease="headRelEvt(event);">
        <mx:columns>
            <mx:DataGridColumn minWidth="120" dataField="Column1"/>
            <mx:DataGridColumn minWidth="200" dataField="Column2"/>
            <mx:DataGridColumn width="75" dataField="Column3"/>
        </mx:columns>
    </mx:DataGrid>

</mx:Application>

Related examples in the same category

1.	Link Object attribute with DataGridColumn
2.	Set DataGridColumn to not editable
3.	Set header text for DataGridColumn
4.	Toggle the visibility for a DataGridColumn
5.	Hide DataGridColumn by setting visible to false
6.	Using DataGridColumn to control column titles
7.	Using a label function to support a multicolumn DataGrid
8.	DataGrid column with an inline item renderer
9.	Set Column width for DataGrid
10.	Set an Array element to the child tag of the tag
11.	Hiding and displaying DataGrid columns
12.	Resizable DataGridColumn
13.	DataGridColumn Header Text
14.	DataGridColumn editorDataField
15.	Reference data from ArrayCollection from DataGridColumn
16.	DataGrid with DataGridColumn
17.	DataGrid and DataGridColumn
18.	Use to set options
19.	DataGrid Default Columns
20.	DataGrid Explicit Columns
21.	Use Labels from ArrayCollection as the column title for DataGrid
22.	Specify Sort Functions for DataGrid Columns
23.	Specify an Array element to the child tag of the tag
24.	DataGrid Visible Column
25.	Handling a user interaction and passing only data to a function
26.	Item renderer that renders an image in a column
27.	Use item editors

Sorting a DataGrid on multiple columns : DataGridColumn « Grid « Flex

Related examples in the same category