Как отсортировать гибкую сетку данных по нескольким столбцам? - PullRequest
Новая
       35

Как отсортировать гибкую сетку данных по нескольким столбцам?

8 голосов
/ 17 сентября 2008

У меня есть сетка данных, заполненная, как показано ниже. Когда пользователь нажимает на заголовок столбца, я хотел бы отсортировать строки, используя лексикографическую сортировку, в которой сначала используется выбранный столбец, затем остальные столбцы используются в порядке слева направо, чтобы разорвать любые связи. Как я могу закодировать это?

(У меня есть один ответ, который я опубликую ниже, но у него есть проблема - я буду в восторге, если кто-нибудь сможет предоставить лучший ответ!)

Вот макет: 

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    layout="absolute" creationComplete="onCreationComplete()">

    <mx:Script source="GridCode.as" />

    <mx:DataGrid id="theGrid" x="61" y="55" width="466" height="317">
        <mx:columns>
            <mx:DataGridColumn dataField="A"/>
            <mx:DataGridColumn dataField="B"/>
            <mx:DataGridColumn dataField="C"/>
        </mx:columns>
    </mx:DataGrid>

</mx:Application>

А вот код поддержки: 

import mx.collections.ArrayCollection;
import mx.collections.Sort;
import mx.collections.SortField;
import mx.controls.dataGridClasses.DataGridColumn;
import mx.events.DataGridEvent;

public function onCreationComplete():void
{
    var ar:ArrayCollection = new ArrayCollection();
    var ob:Object;
    for( var i:int=0; i<20; i++ )
    {
        ob = new Object();
        ob["A"] = i;
        ob["B"] = i%3;
        ob["C"] = i%5;
        ar.addItem(ob);
    }
    this.theGrid.dataProvider = ar;
}

1 Ответ

12 голосов
/ 17 сентября 2008

Лучший ответ, который я нашел на данный момент, - захват события headerRelease, когда пользователь нажимает: 

<mx:DataGrid id="theGrid" x="61" y="55" width="466" height="317"
        headerRelease="onHeaderRelease(event)">

Обработчик событий может затем применить порядок сортировки к данным: 

private var lastIndex:int = -1;
private var desc:Boolean = false;

public function onHeaderRelease(evt:DataGridEvent):void
{
    evt.preventDefault();

    var srt:Sort = new Sort();
    var fields:Array = new Array();

    if( evt.columnIndex == lastIndex )
    {
        desc = !desc;
    }
    else
    {
        desc = false;
        lastIndex = evt.columnIndex;
    }

    fields.push( new SortField( evt.dataField, false, desc ) );
    if( evt.dataField != "A" )
        fields.push( new SortField("A", false, desc) );
    if( evt.dataField != "B" )
        fields.push( new SortField("B", false, desc) );
    if( evt.dataField != "C" )
        fields.push( new SortField("C", false, desc) );
    srt.fields = fields;

    var ar:ArrayCollection = this.theGrid.dataProvider as ArrayCollection;
    ar.sort = srt;
    ar.refresh();
}

Однако у этого подхода есть хорошо известная проблема, заключающаяся в том, что в заголовках столбцов больше не отображаются маленькие стрелки, указывающие направление сортировки. Это побочный эффект звонка evt.preventDefault () однако вы должны сделать этот вызов, иначе ваша пользовательская сортировка не будет применена.

...