AdvancedDataGrid dataField - how to use a subarray or object in flex? - apache-flex

Question

I have an advanced data grid in flex (flash builder 4). It's dataProvider is pointing to an ArrayCollection (this._encounters).
Inside that array collection is a property that is an object (a client object).
I tried setting the dataField to "clientObj.firstName" to refer to the first name property within the clientObj property of the this._encounters array collection. It did not show anything.
So, I added a labelFunction to that column (code below) to set the text in the cell. This works fine and now I have values showing in the grid.
The problem is now when I click the title of column to sort it. It throws an error that property clientObj.firstName is not found in my array collection!
So, is there a better way to set the dataField / source for a column and point at a property in a sub-object -- or a way to fix the sort?
Below the first column
<mx:AdvancedDataGrid x="0" y="25" id="adgEncounters" designViewDataType="flat" width="100%" height="100%" dataProvider="{this._encounters}">
<mx:columns>
<mx:AdvancedDataGridColumn headerText="first" dataField="clientObj.firstName" labelFunction="encounterGridLabelFunct"/>
<mx:AdvancedDataGridColumn headerText="first" dataField="thisWorksField"/>
</mx:columns>
</mx:AdvancedDataGrid>
protected function encounterGridLabelFunct(item:Object, column:AdvancedDataGridColumn):String //put just the HH:MM in to the grid, not the whole date string
{
if(column.headerText=="first") result=item.clientObj.firstName;
return result;
}
update:
Here is the final working code I used. 3 example sort functions, 1 for numeric sorting, 1 for String sorting and one for Date sorting (string date from a database).:
// sort adg column numerically
private function numericSortByField(subObjectName:String, fieldName:String):Function
{
return function(obj1:Object, obj2:Object):int
{
var value1:Number = (obj1[subObjectName][fieldName] == '' || obj1[subObjectName][fieldName] == null) ? null : new Number(obj1[subObjectName][fieldName]);
var value2:Number = (obj2[subObjectName][fieldName] == '' || obj2[subObjectName][fieldName] == null) ? null : new Number(obj2[subObjectName][fieldName]);
return ObjectUtil.numericCompare(value1, value2);
}
}
//sort adg column string
private function stringSortByField(subObjectName:String, fieldName:String):Function
{
return function(obj1:Object, obj2:Object):int
{
var value1:String = (obj1[subObjectName][fieldName] == '' || obj1[subObjectName][fieldName] == null) ? null : new String(obj1[subObjectName][fieldName]);
var value2:String = (obj2[subObjectName][fieldName] == '' || obj2[subObjectName][fieldName] == null) ? null : new String(obj2[subObjectName][fieldName]);
return ObjectUtil.stringCompare(value1, value2);
}
}
//sort adg date diff (takes date strings for example from a db)
private function dateSortByField(subObjectName:String, fieldName:String):Function
{
return function(obj1:Object, obj2:Object):int
{
var value1:String = (obj1[subObjectName][fieldName] == '' || obj1[subObjectName][fieldName] == null) ? null : new String(obj1[subObjectName][fieldName]);
var value2:String = (obj2[subObjectName][fieldName] == '' || obj2[subObjectName][fieldName] == null) ? null : new String(obj2[subObjectName][fieldName]);
var value1Date:Date = new Date();
var value1Time:int = value1Date.setTime(Date.parse(value1));
var value2Date:Date = new Date();
var value2Time:int = value2Date.setTime(Date.parse(value2));
return ObjectUtil.numericCompare(value1Time, value2Time);
}
}
In the mxml above, this is the changed line - notice the stringSortByField added:
<mx:AdvancedDataGridColumn headerText="first" dataField="clientObj.firstName" sortCompareFunction="{stringSortByField('clientObj','firstName')}" labelFunction="encounterGridLabelFunct"/>
If it were a numeric field use the numericSortByField. If it were a date string from a database, use the dateSortByField function instead.

Answer 1

You could use a custom compare function, thats how I do it (obviously your itemA
and itemB will be different objects, so cast them as such):
In your AdvancedDataGridColumn put in:
sortCompareFunction="string_sortCompareFunc"
and make the function:
private function string_sortCompareFunc(itemA:Object, itemB:Object):int
{
var a:String = itemA as String;
var b:String = itemB as String;
return ObjectUtil.stringCompare(a, b);
}