Flex – 使用 Drag 實作 AdvancedDataGrid 刪除功能

雖然在 RIA 的領域裡使用 Drag 來達到的功能是最基本也是最常見的，故在這裡還是來實作一下 Drag AdvancedDataGrid 的 Row 來達到 Delete 的效果.(這個功能只能說是炫而己，並不實用)…

首先在 AdvancedDataGrid 中加入 dragEnabled="true" 此設定.

<mx:AdvancedDataGrid id="grid" width="100%" height="100%"
  dragEnabled="true">

其次在所需 Drag 至的目標上加入 dragDrop 及 DragEnter 的 Event Handler.

<s:Image id="recycleBin" source="@Embed('images/RecycleBin.png')"
  dragDrop="recycleBin_dragDrop(event);"
  dragEnter="recycleBin_dragEnter(event);" />

其 dragDrop 及 DragEnter 的 Code 如下所示：

private function recycleBin_dragEnter(event:DragEvent):void {
  var obj:IUIComponent = IUIComponent(event.currentTarget);
  DragManager.acceptDragDrop(obj);
}
      
private function recycleBin_dragDrop(event:DragEvent):void {
  var values : Array = grid.selectedItems;
  while(values.length > 0) {
    var item : object = values.pop() as object;
    arraycollection.removeItemAt(arraycollection.getItemIndex(item));
  }  
}

完成上述的步驟就實現了 Drag 來刪除 AdvancedDataGrid 的 Row Item.