comment trier un flex de grille de données selon plusieurs colonnes?

J'ai un datagrid, peuplé comme indiqué ci-dessous. Lorsque l'utilisateur clique sur un en-tête de colonne, je voudrais trier les lignes à l'aide d'un tri lexicographique dans lequel la colonne sélectionnée est utilisée en premier, puis le reste des colonnes sont utilisées dans de gauche à droite afin de rompre tous les liens. Comment puis-je code?

(J'ai une réponse, je vais poster ci-dessous, mais il a un problème, je serai ravi si quelqu'un peut fournir un meilleur!)

Voici la mise en page:

<?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>

Et voici le code de soutien:

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;
}

OriginalL'auteur Eric | 2008-09-17

  1. 12

    La meilleure réponse que j'ai trouvé pour l'instant est de capturer le headerRelease cas lorsque l'utilisateur clique sur:

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

    Le gestionnaire d'événement peut alors appliquer un ordre de tri pour les données:

    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();
}

    Toutefois, cette approche a un problème bien connu, qui est que les en-têtes de colonne n'est plus de l'affichage des petites flèches pour montrer le sens du tri. C'est un effet secondaire de l'appel
    evt.preventDefault()
    cependant, vous devez faire appel ou autre votre de tri personnalisé ne sera pas appliqué.

    OriginalL'auteur Eric