Search code examples
sortingapache-flexdataprovidercolumnheader

Sorting datagrid by two columns removes the sort arrow


I'm using Flex version 3.6 and I have a requirement to sort a data grid by two columns. When I click on a column header, the sort arrow displays over it.

What I'm trying to do now is when I click on 1 particular column, it will sort on two columns. That part's working.

But I've noticed that the sort arrow indicator that usually appears over a sorted column has disappeared. I'm using a subclass of DataGrid, so after I sorted, I tried to use placeSortArrow()but I noticed in DataGridHeader.as that sortArrowis null.

protected function headerReleaseListener(event:DataGridEvent):void
{
    if(event.columnIndex == 0)
    {
        event.preventDefault();

        var sort:Sort = new Sort();
        sort.fields = [new SortField("@name",true, true), new SortField("@address",true, false)];

        ArrayCollection(this.dataProvider).sort = sort;
        ArrayCollection(this.dataProvider).refresh();
    }
}

What I'd love to have is to specify on which column the sort arrow should appear on, whether a column is sorted by 1 or more columns. Does anyone know if this is possible?


Solution

  • I found the answer to the disappearing sort arrows from another question: Flex: Database driven DataGrid: arrows disappearing in a question answered by ili and adapted it to suit my code.

    Because there were two columns sorted, the internal sortIndexwas -1 and consequently the sortArrow was null.

    By picking a column to display the sort on (I used the primary sort column) and setting a sortIndex and direction, the sortArrownow appears.

    protected function headerReleaseListener(event:DataGridEvent):void
    {
        if(event.columnIndex == 0)
        {
            event.preventDefault();
    
            var sort:Sort = new Sort();
            sort.fields = [new SortField("@name",true, true), new SortField("@address",true, false)];
    
            ArrayCollection(this.dataProvider).sort = sort;
            ArrayCollection(this.dataProvider).refresh();
    
            mx_internal::sortIndex = event.columnIndex;
    
            mx_internal::sortDirection = (mx_internal::sortDirection == null || mx_internal::sortDirection == "ASC") ? "DESC" : "ASC";
    
            placeSortArrow();
        }
    }