Discussion :

[Tan]

Bonjour,

Voici un deuxième problème (et dernier j'espère) que je traine depuis quelques jours.

Objectif:
Deux listes alimentés par deux dataprovider différents (mais de même structure).
Deux boutons pour permettre d'échanger les données entre ces listes.

Voici un code qui fonctionne:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   contentCreationComplete="init()">
 
	<fx:Declarations>
		<mx:ArrayCollection id="dataGauche">
			<fx:Object nom="Gauche1"/>
			<fx:Object nom="Gauche2"/>
			<fx:Object nom="Gauche3"/>
			<fx:Object nom="Gauche4"/>
		</mx:ArrayCollection>
 
		<mx:ArrayCollection id="dataDroite">
			<fx:Object nom="Droite1"/>
			<fx:Object nom="Droite2"/>
			<fx:Object nom="Droite3"/>
			<fx:Object nom="Droite4"/>
		</mx:ArrayCollection>
	</fx:Declarations>
 
	<fx:Script>
		<![CDATA[
			import mx.collections.XMLListCollection;
			import spark.components.DataGrid;
 
			private function changeElement(datagrid1:DataGrid, datagrid2:DataGrid):void {
				var toRemove:Array=[];
				for (var i:int=0; i < datagrid2.selectedItems.length; i++)
				{
					toRemove.push(datagrid2.selectedItems[i]);
				}
				for (i=0; i < toRemove.length; i++)
				{
					datagrid1.dataProvider.addItem(toRemove[i]);
					datagrid2.dataProvider.removeItemAt(datagrid2.dataProvider.getItemIndex(toRemove[i]));
				}
			}
			// Supprime les éléments sélectionnés de la liste de droite
			private function deleteSelection():void
			{
				changeElement(datagridGauche, datagridDroite);
			}
			// Ajoute les éléments sélectionnés à la liste de droite
			private function addSelection():void
			{
				changeElement(datagridDroite, datagridGauche);
			}
		]]>
	</fx:Script>
 
	<s:HGroup>
		<!-- liste de gauche -->
		<s:DataGrid id="datagridGauche"	dataProvider="{dataGauche}">
			<s:columns>
				<s:ArrayList>
					<s:GridColumn dataField="nom"/>
				</s:ArrayList>
			</s:columns>
		</s:DataGrid>
 
		<!-- bouton d'échange -->
		<s:VGroup verticalAlign="middle" height="100%">
			<s:Button id="btnAjout" label="&gt;" click="addSelection()"/>				
			<s:Button id="btnSuppr" label="&lt;" click="deleteSelection()"/>
		</s:VGroup>
 
		<!-- liste de droite -->
		<s:DataGrid id="datagridDroite" dataProvider="{dataDroite}">
			<s:columns>
				<s:ArrayList>
					<s:GridColumn dataField="nom"/>
				</s:ArrayList>
			</s:columns>
		</s:DataGrid>
	</s:HGroup>
</s:Application>

Ce code fonctionne, par contre, si je change le dataprovider pour le mettre en XML (dans la partie fxeclarations), cela ne fonctionne plus:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<fx:XML id="xmlDataGauche" source="xml/xmlDataGauche.xml"/>
		<fx:XML id="xmlDataDroite" source="xml/xmlDataDroite.xml"/>
		<s:XMLListCollection id="dataGauche" source="{xmlDataGauche..element}"/>
		<s:XMLListCollection id="dataDroite" source="{xmlDataDroite..element}"/>

Voici les fichiers xml correspond:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<provider>
	<element>
		<nom>Gauche1</nom>
	</element>
	<element>
		<nom>Gauche2</nom>
	</element>
	<element>
		<nom>Gauche3</nom>
	</element>
	<element>
		<nom>Gauche4</nom>
	</element>
</provider>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<provider>
	<element>
		<nom>Droite1</nom>
	</element>
	<element>
		<nom>Droite2</nom>
	</element>
	<element>
		<nom>Droite3</nom>
	</element>
	<element>
		<nom>Droite4</nom>
	</element>
</provider>

Ici, l'élément disparaitre de la première liste, mais n'apparait dans la seconde, et lorsque, je fais l'échange inverse, les éléments supprimés précédemment réapparaissent.

Pourquoi ai-je ce comportement. Dans le principe, dans les deux cas on est sur des classes héritant de ListCollectionView, je fais des addItem sur des objects de même type.

[Krazymins]

Salut,

Qu'est-ce que ça te donne si tu fais un invalidateList() juste après les changements dans tes lists ? :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
// Supprime les éléments sélectionnés de la liste de droite
			private function deleteSelection():void
			{
				changeElement(datagridGauche, datagridDroite);
                                datagridDroite.invalidateList();
			}
			// Ajoute les éléments sélectionnés à la liste de droite
			private function addSelection():void
			{
				changeElement(datagridDroite, datagridGauche);
                                datagridDroite.invalidateList();
			}

[Tan]

Bonjour,

Le DataGrid que j'utilise est le suivant spark.components.DataGrid (celui de Spark), la méthode que tu m'indiques, ne semble exister que pour les composants mx.

Je ne peux donc pas tester ce que tu m'as demandé. Peut-être y a-t-il un équivalent (il faudrait que je regarde).

Mais, ce que je ne comprends pas c'est pourquoi cela marche dans le premier cas.

Merci, pour cette première piste.

[Madfrix]

Bonjour,

il faut que tu appliques un refresh() sur ton dataprovider

[Madfrix]

Après m'être penché un peu plus sur ton problème, tu peux faire ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
private function changeElement(datagrid1:DataGrid, datagrid2:DataGrid):void {
 
	var v:Vector.<Object> = datagrid2.selectedItems;
	var dp1:XMLListCollection = XMLListCollection(datagrid1.dataProvider);
	var dp2:XMLListCollection = XMLListCollection(datagrid2.dataProvider);
 
	for each(var o:Object in v)
	{
		dp2.removeItemAt(dp2.getItemIndex(o));
		dp1.addItem(new XMLList(o));
	}  
 
}

Par contre, si tu inverses les instructions removeItemAt et addItem cela ne marche pas et je ne m'explique pas pourquoi...

[Tan]

Merci, le code que tu m'as fourni fonctionne avec les XMLCollectionList, mais plus avec les ArrayList.

Je l'ai modifié pour qu'il soit plus général en utilisant les IList:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
private function changeElement(datagrid1:DataGrid, datagrid2:DataGrid):void {
	var v:Vector.<Object> = datagrid2.selectedItems;
	var dp1:IList = IList(datagrid1.dataProvider);
	var dp2:IList = IList(datagrid2.dataProvider);
 
	for each(var o:Object in v)
	{
		dp2.removeItemAt(dp2.getItemIndex(o));
		dp1.addItem(o);
	}  
}

Et la, ça semble fonctionner avec des XMLCollectionList, ArrayCollection, ArrayList, ce qui me va.

Par contre, j'ai essayé de comprendre pourquoi ton code fonctionnait, et pas le mien. Car mon code initial me paraissait pas trop mal.

Et en fait, j'ai le même problème que toi à la base, l'ordre entre le addItem et le removeItemAt change le fonctionnement.

Les deux méthodes sont bonnes, j'ai juste choisi le mauvais ordre.

Par contre, comme toi, je ne m'explique pas ce fonctionnement.

Je metterai ce signalement à résolu, plus tard dans la journée, des fois que quelqu'un aurait une explication (j'aime comprendre, et c'est vrai qu'avec flex, c'est le deuxième problème que je ne m'explique pas), avec celui d'hier).

En tant cas, merci pour ton aide, sur mes deux problèmes.