Reputation: 125
I need to to a programmatic multi column sorting on the AdvancedDataGrid. The issue is, currently I am implementing paging on my grid. So, if I sort the data, only the perticular page is being sorted. So, I need to sort the entire list by the column criteria.
I tried HeaderRelease event, but I guess it is of no use as I need to make a round trip call to the server to get the sorted data. Is there any way I can implement that. I also need to show the sort markers in the Column headers' right position, indicating the sort numbers and direction.
'll really appreciate the help
Thanks :)
Upvotes: 0
Views: 4447
Reputation: 1
You can also have a look at the AdvancedDataGridSortItemRenderer
class. This helps to customise the sort item renderer.
Upvotes: 0
Reputation: 628
Try modifiyng the event priority of the sort event, no need to override the sort handler, but can't be done in mxml.
protected function dataGrid_initializeHandler(event:FlexEvent):void { dataGrid.addEventListener(AdvancedDataGridEvent.SORT, dataGrid_sortHandler, false, -50); } protected function dataGrid_sortHandler(event:FlexEvent):void { dataGrid.dataProvider.sort; // now up to date! } <mx:AdvancedDataGrid id="dataGrid" initialize="dataGrid_initializeHandler(event)" dataProvider="{model.dataProvider}" />
Upvotes: 0
Reputation:
You need to extend the AdvancedDataGrid and override the sortHandler
public var orderBy:String;
override protected function sortHandler(event:AdvancedDataGridEvent):void {
super.sortHandler(event);
var arry:Array = [];
for each(var o:SortField in collection.sort.fields){
arry.push(o.name+' '+(o.descending?'DESC':'ASC'));
}
orderBy = arry.join(',');
}
Upvotes: 1
Reputation:
SORRY Guys!! Missed the inital part of the code.... Here is the right code
<:AdvancedDataGrid headerWordWrap="{allowHeaderWordWrap}" headerRelease="sortCaseInsensitive(event)" headerHeight="{headerHt}">
<:Script>
<[CDATA[
import mx.events.CollectionEvent;
import mx.binding.utils.BindingUtils;
import mx.collections.SortField;
import mx.collections.Sort;
import mx.collections.ArrayCollection;
import mx.events.AdvancedDataGridEvent;
private var sortOrder:Boolean = true;
[Bindable]
public var headerHt:int = 30;
[Inspectable(defaultValue="true", type="Boolean", enumeration="true,false", inherit="yes")]
[Bindable]
public var allowHeaderWordWrap:Boolean = true;
public function sortCaseInsensitive(event:AdvancedDataGridEvent):void{
var genericDataProvider:Object = this.dataProvider as Object;
sortOrder = !sortOrder;
//genericDataProvider.sort = new Sort();
if(genericDataProvider.sort == null){
genericDataProvider.sort = new Sort();
}
var sortField:SortField = new SortField(event.dataField,true,sortOrder);
switch (event.dataField) {
case "assmtId":
sortField.numeric = true;
break;
}//switch
//genericDataProvider.sort.fields = [sortField];
if(genericDataProvider.sort.fields == null){
genericDataProvider.sort.fields = [sortField];
}else{
//if dataField is not already present in sort fields array
if(genericDataProvider.sort.fields.indexOf(sortField) != -1){
genericDataProvider.sort.fields = genericDataProvider.sort.fields.concat(sortField);
}
}
genericDataProvider.refresh();
// Send custom event to server and pass the array of sort to it the server side technology will make dynamic query and return the result
}//sortCaseInsensitive
]]>
<:Script>
<:AdvancedDataGrid>
Upvotes: 0
Reputation:
Create your own custom Advance Datagrid as given in the example below. You have the array of sorted columns and the order. Send a cutom event and pass this array to it. The server side Tech will make the query accordingly and return you the result.
import mx.events.CollectionEvent;
import mx.binding.utils.BindingUtils;
import mx.collections.SortField;
import mx.collections.Sort;
import mx.collections.ArrayCollection;
import mx.events.AdvancedDataGridEvent;
private var sortOrder:Boolean = true;
[Bindable]
public var headerHt:int = 30;
[Inspectable(defaultValue="true", type="Boolean", enumeration="true,false", inherit="yes")]
[Bindable]
public var allowHeaderWordWrap:Boolean = true;
public function sortCaseInsensitive(event:AdvancedDataGridEvent):void{
var genericDataProvider:Object = this.dataProvider as Object;
sortOrder = !sortOrder;
//genericDataProvider.sort = new Sort();
if(genericDataProvider.sort == null){
genericDataProvider.sort = new Sort();
}
var sortField:SortField = new SortField(event.dataField,true,sortOrder);
switch (event.dataField) {
case "assmtId":
sortField.numeric = true;
break;
}//switch
//genericDataProvider.sort.fields = [sortField];
if(genericDataProvider.sort.fields == null){
genericDataProvider.sort.fields = [sortField];
}else{
//if dataField is not already present in sort fields array
if(genericDataProvider.sort.fields.indexOf(sortField) != -1){
genericDataProvider.sort.fields = genericDataProvider.sort.fields.concat(sortField);
}
}
genericDataProvider.refresh();
// Send custom event to server and pass the array of sort to it the server side technology will make dynamic query and return the result
}//sortCaseInsensitive
]]>
</mx:Script>
Upvotes: 0
Reputation: 13984
If your data is paged, you'll have to go to the server to retrieve the data anyways. If only a portion of the data is stored client side, it might be better to just sort on the server, since only the server will have all the data.
Upvotes: 0