What I mean in the title is this: having a data grid with a column containing some priorities (like: urgent, normal, high) among other columns, you want to sort by this priority column, but you notice that is not sorted by its importance but alphabetically. To make it crystal clear follow the example bellow…
Having the following XML structure:
<root> <row> <priority>low</priority> <col2>a</col2> <priority_int>1</priority_int> </row> <row> <priority>extremely urgent</priority> <col2>f</col2> <priority_int>6</priority_int> </row> <row> <priority>normal</priority> <col2>b</col2> <priority_int>2</priority_int> </row> <row> <priority>high</priority> <col2>d</col2> <priority_int>4</priority_int> </row> <row> <priority>urgent</priority> <col2>e</col2> <priority_int>5</priority_int> </row> <row> <priority>medium</priority> <col2>c</col2> <priority_int>3</priority_int> </row> </root>
When you’ll sort by the first column it will be sorted alphabetically. The first column will contain: “low“, “extremely urgent“, “normal“, “high“, “urgent” and “medium” strings which, normally, will be sorted to: “extremely urgent“, “high“, “low“, “medium“, “normal” and “urgent” (see bellow).
This is a correct sorting and this is how dataGrid should sort but is not what we want. We want to be sorted by its real priority.
For this we will use sortCompareFunction attribute/property of DataGridColumn like in the code bellow:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 | <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:DataGrid x="10" y="10" height="200" width="350" dataProvider="{_xmlData.children()}"> <mx:columns> <mx:DataGridColumn headerText="Column 1" dataField="priority" sortCompareFunction="externalSort"/> <mx:DataGridColumn headerText="Column 2" dataField="alpha"/> </mx:columns> </mx:DataGrid> <mx:Script> <![CDATA[ // our data provider [Bindable] private var _xmlData:XML = <root> <row> <priority>low</priority> <alpha>a</alpha> <priority_int>1</priority_int> </row> <row> <priority>extremely urgent</priority> <alpha>f</alpha> <priority_int>6</priority_int> </row> <row> <priority>normal</priority> <alpha>b</alpha> <priority_int>2</priority_int> </row> <row> <priority>high</priority> <alpha>d</alpha> <priority_int>4</priority_int> </row> <row> <priority>urgent</priority> <alpha>e</alpha> <priority_int>5</priority_int> </row> <row> <priority>medium</priority> <alpha>c</alpha> <priority_int>3</priority_int> </row> </root>; // sorting function // we use this to sort by another column private function externalSort(o1:Object,o2:Object):int { // sorting by third column if (o1.priority_int > o2.priority_int) return -1; else if (o1.priority_int < o2.priority_int) return 1; else return 0; } ]]> </mx:Script> </mx:Application> |
We instructed the DataGridColumns to use externalSort function for sorting and externalSort compares two adjacent rows applying to them the specified condition. Now lets see our data grid.
Now it works how we wanted, is sorting by its real priority.
Code can be downloaded at the end.
|
Tags: ActionScript, datagrid, sorting
This post was written by Andrei Ionescu
Views: 6352
Articles
We actually have a grid that solves the issue described above, along with the issue of the initial sort icon, both on classic and advanced datagrid with multicolumn sort, also sorting/filtering by dates/numbers/booleans where the actual data is string and a intermediate conversion is required before the sort/filter operation. Please take a look at http://www.flexicious.com.