DragDrop Datagrid vers AdvancedDataGrid

**Mygush** · 13/10/2011, 17h45

Bonjour à tous,
Après avoir fait un tour sur le forum sans trouver de solution à mon pb, je m'en remet à vous.
Je souhaite pouvoir faire un drag d'un item sélectionné dans un Datagrid et ensuite faire un drop dans une cellule d'un AdvancedDataGrid.
Voici mon datagrid :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<mx:DataGrid id="dtgCellule2" dataProvider="{dpCellules}" width="100%" height="100%" dragEnabled="true">
	<mx:columns>
		<mx:DataGridColumn dataField="numCellule" headerText="N° cellule" visible="false" />
		<mx:DataGridColumn dataField="typeCellulaire" headerText="Type de cellule" width="250" />									
		<mx:DataGridColumn dataField="nbPassage" headerText="Nombre de passage" />
		<mx:DataGridColumn dataField="dateCongelation" headerText="Date congélation" />
		<mx:DataGridColumn dataField="nbCellule" headerText="Nombre de cellules" />
		<mx:DataGridColumn dataField="nbCryoInitial" headerText="Nombre de cryotubes initial" />
		<mx:DataGridColumn dataField="naturePrelevement" headerText="Nature prélèvement" />
		<mx:DataGridColumn dataField="numDonneur" headerText="N° Donneur" />
		<mx:DataGridColumn dataField="numPool" headerText="N° Pool" />
		<mx:DataGridColumn dataField="etat" headerText="Etat" />
	</mx:columns>
</mx:DataGrid>

et mon AdvancedDataGrid:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<mx:AdvancedDataGrid id="dtgRangement" dataProvider="{dpRangementsBoite}" width="100%" height="100%" selectionMode="singleCell" dropEnabled="true" dragEnter="dragEnterHandler(event)" dragDrop="dragDropHandler(event);">
	<mx:columns>
		<mx:AdvancedDataGridColumn dataField="rangementCol1" headerText="Col1" />
		<mx:AdvancedDataGridColumn dataField="rangementCol2" headerText="Col2" />
		<mx:AdvancedDataGridColumn dataField="rangementCol3" headerText="Col3" />
		<mx:AdvancedDataGridColumn dataField="rangementCol4" headerText="Col4" />
		<mx:AdvancedDataGridColumn dataField="rangementCol5" headerText="Col5" />	
		<mx:AdvancedDataGridColumn dataField="rangementCol6" headerText="Col6" />	
		<mx:AdvancedDataGridColumn dataField="rangementCol7" headerText="Col7" />
		<mx:AdvancedDataGridColumn dataField="rangementCol8" headerText="Col8" />
		<mx:AdvancedDataGridColumn dataField="rangementCol9" headerText="Col9" />
		<mx:AdvancedDataGridColumn dataField="rangementCol10" headerText="Col10" />
	</mx:columns>
</mx:AdvancedDataGrid>

En fait je souhaite pouvoir affecter par exemple la valeur sélectionnée dans mon datagrid (a savoir dans la colonne type de cellule) et pouvoir la positionner dans n'importe quelle ligne et colonne de mon AdvancedDataGrid sachant que celui-ci est en selectionMode="singleCell".
La seule chose que j'arrive à faire c'est d'ajouter une ligne dans mon AdvancedDataGrid avec n'importe quel index mais je n'arrive pas à modifier une ligne existante et notamment la cellule sélectionnée :

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
private function dragEnterHandler(event:DragEvent):void {
	DragManager.acceptDragDrop(dtgRangement);
	DragManager.showFeedback(DragManager.MOVE);
}
 
private function dragDropHandler(event:DragEvent):void {
   	if (event.dragSource.hasFormat("items")) {
                event.preventDefault();
                event.currentTarget.hideDropFeedback(event);
                var dropTarget:AdvancedDataGrid = AdvancedDataGrid(event.currentTarget);
                var itemsArray:Array = event.dragSource.dataForFormat('items') as Array;
                var tempItem:Object = { rangementCol1: itemsArray[0].typeCellulaire };
                var dropLoc:int = dropTarget.calculateDropIndex(event);
    	        IList(dropTarget.dataProvider).addItemAt(tempItem,dropLoc);
  	}
}

Merci d'avance pour votre aide!

**Madfrix** · 13/10/2011, 23h09

Salut,

je t'ai fait un petit exemple, je sais pas s'il correspond exactement à ton besoin mais tu pourras t'en inspirer

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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
 
<?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" minWidth="955" minHeight="600">
 
	<fx:Script>
		<![CDATA[
			import mx.collections.ListCollectionView;
			import mx.core.IUIComponent;
			import mx.events.DragEvent;
			import mx.events.ListEvent;
			import mx.managers.DragManager;
 
			private var eventCached:DragEvent;
 
			protected function dragEnterHandler(event:DragEvent):void
			{
				dtgRangement.addEventListener(ListEvent.ITEM_ROLL_OVER, handleItemRollOver);	
				DragManager.acceptDragDrop(IUIComponent(dtgRangement));
				DragManager.showFeedback(DragManager.MOVE);					
			}
 
			protected function dragDropHandler(event:DragEvent):void
			{
				eventCached = event;				
			}			
 
			protected function handleItemRollOver(event:ListEvent):void
			{							
				dtgRangement.removeEventListener(ListEvent.ITEM_ROLL_OVER, handleItemRollOver);	
 
				var adg:AdvancedDataGrid = AdvancedDataGrid(event.currentTarget);
 
				var lcv:ListCollectionView = ListCollectionView(AdvancedDataGrid(eventCached.currentTarget).dataProvider);
 
				var o:Object = lcv.getItemAt(event.rowIndex);
				o[AdvancedDataGridColumn(adg.columns[event.columnIndex]).dataField] = eventCached.dragSource.dataForFormat("items")[0]["numCellule"];
 
				dtgRangement.dataProvider.setItemAt(o, event.rowIndex);			
			}
 
		]]>
	</fx:Script>
 
	<s:layout>
		<s:VerticalLayout />
	</s:layout>
 
	<mx:DataGrid id="dtgCellule2" width="50%" height="50%" dragEnabled="true">
		<mx:columns>
			<mx:DataGridColumn dataField="numCellule" headerText="N° cellule" visible="true" />
			<mx:DataGridColumn dataField="typeCellulaire" headerText="Type de cellule" width="250" />									
			<mx:DataGridColumn dataField="nbPassage" headerText="Nombre de passage" />
			<mx:DataGridColumn dataField="dateCongelation" headerText="Date congélation" />
			<mx:DataGridColumn dataField="nbCellule" headerText="Nombre de cellules" />
			<mx:DataGridColumn dataField="nbCryoInitial" headerText="Nombre de cryotubes initial" />
			<mx:DataGridColumn dataField="naturePrelevement" headerText="Nature prélèvement" />
			<mx:DataGridColumn dataField="numDonneur" headerText="N° Donneur" />
			<mx:DataGridColumn dataField="numPool" headerText="N° Pool" />
			<mx:DataGridColumn dataField="etat" headerText="Etat" />
		</mx:columns>
 
		<mx:dataProvider>
			<s:ArrayCollection>
				<fx:Object numCellule="1" typeCellulaire="2" nbPassage="3" dateCongelation="4" nbCellule="5" 
						   nbCryoInitial="6" naturePrelevement="7" numDonneur="8" numPool="9" etat="10"/>
				<fx:Object numCellule="11" typeCellulaire="12" nbPassage="13" dateCongelation="14" nbCellule="15" 
						   nbCryoInitial="16" naturePrelevement="17" numDonneur="18" numPool="19" etat="20"/>
			</s:ArrayCollection>				
		</mx:dataProvider>
	</mx:DataGrid>
 
	<mx:AdvancedDataGrid id="dtgRangement" width="50%" height="50%" selectionMode="singleCell" dropEnabled="true" dragEnter="dragEnterHandler(event)" dragDrop="dragDropHandler(event)">
		<mx:columns>
			<mx:AdvancedDataGridColumn dataField="rangementCol1" headerText="Col1" />
			<mx:AdvancedDataGridColumn dataField="rangementCol2" headerText="Col2" />
			<mx:AdvancedDataGridColumn dataField="rangementCol3" headerText="Col3" />
			<mx:AdvancedDataGridColumn dataField="rangementCol4" headerText="Col4" />
			<mx:AdvancedDataGridColumn dataField="rangementCol5" headerText="Col5" />	
			<mx:AdvancedDataGridColumn dataField="rangementCol6" headerText="Col6" />	
			<mx:AdvancedDataGridColumn dataField="rangementCol7" headerText="Col7" />
			<mx:AdvancedDataGridColumn dataField="rangementCol8" headerText="Col8" />
			<mx:AdvancedDataGridColumn dataField="rangementCol9" headerText="Col9" />
			<mx:AdvancedDataGridColumn dataField="rangementCol10" headerText="Col10" />
		</mx:columns>
		<mx:dataProvider>
			<s:ArrayCollection>
				<fx:Object rangementCol1="1" rangementCol2="2" rangementCol3="3" rangementCol4="4" rangementCol5="5" 
						   rangementCol6="6" rangementCol7="7" rangementCol8="8" rangementCol9="9" rangementCol10="10"/>
				<fx:Object rangementCol1="1" rangementCol2="2" rangementCol3="3" rangementCol4="4" rangementCol5="5" 
						   rangementCol6="6" rangementCol7="7" rangementCol8="8" rangementCol9="9" rangementCol10="10"/>
			</s:ArrayCollection>				
		</mx:dataProvider>
	</mx:AdvancedDataGrid>
 
 
</s:Application>

**Mygush** · 14/10/2011, 09h41

Vraiment un grand merci à toi Madfrix !
Ton exemple correspond exactement à ce que je souhaite faire

Réponse super claire et précise

DragDrop Datagrid vers AdvancedDataGrid [Flex4]

Flex

Vue hybride

Discussions similaires

Partager

Partager