OK, I’m convinced there is a better way to do this, but so far this is the only solution I’ve found…
Any other ideas? Leave em in the comments!
Basically the following post shows one possible way of determining the current sort order of a data grid by grabbing the sortDescending property whenever a user presses on a data grid header.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/08/23/determining-a-datagridcolumn-objects-current-sort-order/ -->
<mx:Application name="DataGridColumn_sortDescending_test"
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Script>
<![CDATA[
import mx.controls.dataGridClasses.DataGridColumn;
import mx.events.DataGridEvent;
private function doHeaderRelease(evt:DataGridEvent):void {
var column:DataGridColumn = DataGridColumn(evt.currentTarget.columns[evt.columnIndex]);
DataGrid(evt.currentTarget).callLater(onCallLater, [column]);
}
private function onCallLater(column:DataGridColumn):void {
columnSortDescending.text = column.dataField + ".sortDescending: " + column.sortDescending;
}
]]>
</mx:Script>
<mx:ApplicationControlBar dock="true">
<mx:Label id="columnSortDescending" />
</mx:ApplicationControlBar>
<mx:DataGrid id="dataGrid"
rowCount="4"
headerRelease="doHeaderRelease(event)">
<mx:columns>
<mx:DataGridColumn id="col1" dataField="label" />
<mx:DataGridColumn id="col2" dataField="data" />
</mx:columns>
<mx:dataProvider>
<mx:Array>
<mx:Object data="one" label="User 1" />
<mx:Object data="two" label="User 2" />
</mx:Array>
</mx:dataProvider>
</mx:DataGrid>
</mx:Application>
View source is enabled in the following example.
April 9, 2009: Actually, here is a much better approach, suggested by my co-worker, and Flex hero, Alex Harui:
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/08/23/determining-a-datagridcolumn-objects-current-sort-order/ -->
<mx:Application name="DataGrid_dataProvider_sort_test"
xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Script>
<![CDATA[
import mx.collections.Sort;
import mx.collections.SortField;
private function init():void {
try {
var s:SortField = Sort(dataGrid.dataProvider.sort).fields[0];
lbl.text = "name:" + s.name + ", descending:" + s.descending;
lbl.setStyle("color", "black");
} catch (err:*) {
lbl.text = "unsorted";
lbl.setStyle("color", "red");
}
}
]]>
</mx:Script>
<mx:ApplicationControlBar dock="true">
<mx:Button id="btn" label="Get sort" click="init();" />
<mx:Label id="lbl" fontWeight="bold" />
</mx:ApplicationControlBar>
<mx:DataGrid id="dataGrid">
<mx:dataProvider>
<mx:Array>
<mx:Object c1="1.One" c2="1.Two" />
<mx:Object c1="2.One" c2="2.Two" />
<mx:Object c1="3.One" c2="3.Two" />
<mx:Object c1="4.One" c2="4.Two" />
<mx:Object c1="5.One" c2="5.Two" />
<mx:Object c1="6.One" c2="6.Two" />
<mx:Object c1="7.One" c2="7.Two" />
<mx:Object c1="8.One" c2="8.Two" />
</mx:Array>
</mx:dataProvider>
</mx:DataGrid>
</mx:Application>

{ 4 comments… read them below or add one }
I think this would work and you do not have to make a callLater method…..
private function doHeaderRelease(event:DataGridEvent):void {
var dg:DataGrid= event.currentTarget as DataGrid;
trace(“column: ” + String(event.dataField));
trace(“descending: ” + String(dg.columns[event.columnIndex].sortDescending));
}
Dan -
Turns out doing it that way cause inaccuracies, for some reason sortDecending will report false too often. Checkout this post:
http://blog.flexexamples.com/2007/08/31/toggling-sortable-columns-in-a-flex-datagrid-control/#comment-4653
good coding…n useful too
I was facing the problem as mentioned in the other post.
This callLater way was helpfull.
Thanks,
Anil