Drag and drop from List to DataGrid
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="initApp();">
<mx:Script>
import mx.events.DragEvent;
import mx.managers.DragManager;
import mx.core.DragSource;
import mx.collections.IList;
import mx.collections.ArrayCollection;
private function initApp():void {
srcList.dataProvider = new ArrayCollection([
{label:"First", data:"1"},
{label:"Second", data:"2"},
{label:"Third", data:"3"},
{label:"Fourth", data:"4"},
]);
destDG.dataProvider = new ArrayCollection([]);
}
private function dragDropHandler(event:DragEvent):void {
if (event.dragSource.hasFormat("items") == false)
{
return;
}
event.preventDefault();
event.currentTarget.hideDropFeedback(event);
var dropTarget:DataGrid =DataGrid(event.currentTarget);
var itemsArray:Array =event.dragSource.dataForFormat('items') as Array;
var tempItem:Object ={ label: itemsArray[0].label,data: itemsArray[0].data,date: new Date()};
var dropLoc:int = dropTarget.calculateDropIndex(event);
ArrayCollection(dropTarget.dataProvider).addItemAt(tempItem, dropLoc);
}
</mx:Script>
<mx:HBox>
<mx:List id="srcList" dragEnabled="true" dragMoveEnabled="true"/>
<mx:DataGrid id="destDG" dropEnabled="true" dragDrop="dragDropHandler(event);">
<mx:columns>
<mx:DataGridColumn dataField="label"/>
<mx:DataGridColumn dataField="data"/>
<mx:DataGridColumn dataField="date"/>
</mx:columns>
</mx:DataGrid>
</mx:HBox>
</mx:Application>
Related examples in the same category
