Dans un soucis (permanent) de séparation des données et de l’affichage, nous allons aborder dans cet article une fonctionnalité permettant de filtrer des données depuis la source, sans modifier cette dernière : les filterFunction

Introduction

A l’instar des labelFunction, les filterFunction constituent un outils très pratique pour contrôler l’affichage de vos données dans votre application. Dans cette exemple nous les utiliserons dans une ComboBox, puis dans une DataGrid. Mais dans les 2 cas, l’application du filtre s’applique sur l’ArrayCollection, via la propriétés filterFunction dont voici la signature :

1

filterFunction(item:Object):Boolean

La signature, une fois de plus, nous donne des indications sur le fonctionnent du filtre, déjà en paramètre (type Object) correspond à la donnée en cours de filtrage, et la fonction retourne un Booléen (si true, on affiche, sinon on n’affiche pas)

Mise en pratique

Nous allons maintenant créer une ComboBox qui proposera une liste de créateur, nous appliquerons ensuite une Function de filtre à la source de données pour n’afficher que les créateurs qui correspondent à un critère bien précis. Ci dessous la source de données que je vais utiliser :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

// dt_createurs.as
import mx.collections.ArrayCollection;
 
[Bindable] 
public var createurs:ArrayCollection = new ArrayCollection([
	{nom:"Cézanne", prenom:"Paul", surnom:null, anneeNaiss:1839, anneeMort:1906, mainAct:"Peinture", nationalites:"fr"},
	{nom:"Picasso", prenom:"Pablo", surnom:null, anneeNaiss:1881, anneeMort:1973, mainAct:"Peinture", nationalites:"fr"},
	{nom:"Duchamp", prenom:"Marcel", surnom:null, anneeNaiss:1887, anneeMort:1968, mainAct:"Artiste", nationalites:"fr"},
	{nom:"Breton", prenom:"André", surnom:null, anneeNaiss:1896, anneeMort:1966, mainAct:"Poéte", nationalites:"fr"},
	{nom:"Calaferte", prenom:"Louis", surnom:null, anneeNaiss:1928, anneeMort:1994, mainAct:"Ecrivain", nationalites:"fr"},
	{nom:"Selby", prenom:"Hubert", surnom:null, anneeNaiss:1928, anneeMort:2004, mainAct:"Ecrivain", nationalites:"us"},
	{nom:"Easton Ellis", prenom:"Bret", surnom:null, anneeNaiss:1964, anneeMort:null, mainAct:"Ecrivain", nationalites:"us"},
	{nom:"Beckett", prenom:"Samuel", surnom:null, anneeNaiss:1906, anneeMort:1989, mainAct:"Dramaturge", nationalites:"ir"},
	{nom:"Joyce", prenom:"James", surnom:null, anneeNaiss:1882, anneeMort:1941, mainAct:"Romancier", nationalites:"ir"}
]);

La fonction de filtrage

La fonction de filtrage aura en charge de retourner uniquement les Créateurs Français (nationalites == « FR »), la fonction est extrèmement simple :

1
2
3

private function filtrerCreateur( o:Object ) :Boolean {
	return (o.nationalites == "fr");
}

Nous devons ensuite affecter à notre source de données la fonction de filtrage, comme expliqué en introduction, tout se joue via la propriété filterFunction de l’ArrayCollection. Donc pour appliquer le filtre, on ajoute un événement initialize à notre application pour que le filtre soit appliqué dès le début :

1
2
3
4

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
	layout="absolute"
	initialize="createurs.filterFunction=filtrerCreateur; createurs.refresh();"
>

Une fois l’attribut filterFunction de votre ArrayCollection renseigné, pensez à faire un refresh() pour que le filtre soit appliqué.

Notez que dans l’exemple, j’applique le filtre à l’événement initialize de l’application, mais on peut l’appliquer aussi sur la combo .

1
2
3
4
5

<mx:ComboBox id="choixCreateurs" 
	dataProvider="{createurs}"
	labelField="nom" 
	initialize="createurs.filterFunction=filtrerCreateur; createurs.refresh();"
/>

Comme vous pouvez le voir, le fonctionnement est similaire car tout se joue au niveau de la source de donnée.

Attention : Comme le filtre s’applique à la source de donnée, si vous voulez filtrer la même source de 2 manière différente, vous allez devoir la dupliquer (avec un ObjectUtil.copy() par exemple.

Ci dessous un petit exemple :

• studio.jacksay.com – ArrayCollection.filterFunction