I'm having some difficulties dragging from an image, and then dropping onto a datagrid. Now I don't want the image in datagrad (or anything crazy like that) I just want the image to act as the drag initiator, which can assign some DragSource data to the datagrid by reference.
I had something working fairly loosely yesterday, but I kept getting an error: TypeError: Error #1009: Cannot access a property or method of a null object reference, when I dropped the image onto the datagrid. Does anyone have an ideas what might be causing this?
Here's my code for starters:
**** Application.mxml (Main Application) **********
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal" xmlns:com="com.*">
<mx:Style source="styles.css"/>
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.DragEvent;
import mx.managers.DragManager;
import flash.events.MouseEvent;
[Bindable] private var dgArray_collection:ArrayCollection = new ArrayCollection();
private function funcDragDrop(event:DragEvent):void
{
//mx.controls.Alert.show("drag drop");
if( event.dragSource.hasFormat( "items" ) )
{
var sourceObject:Object = event.dragSource.dataForFormat( "items" );
mx.controls.Alert.show( sourceObject.name, sourceObject.prices );
}
}
private function funcDragEnter( event:DragEvent ):void
{
DragManager.acceptDragDrop(myDg);
}
]]>
</mx:Script>
<mx:Panel title="Panel Title" width="955" height="600">
<mx:VBox width="100%" height="100%" horizontalAlign="center">
<mx:HBox width="100%" height="50%">
<mx:LineChart id="myChart" dragEnter="funcDragEnter(event)" dragDrop="funcDragDrop(event)"/>
<mx:DataGrid dragEnter="funcDragEnter(event)" dragDrop="funcDragDrop(event)" id="myDg" dropEnabled="true"/>
</mx:HBox>
<com:navigation id="navigation" numberMenuItems="5"/>
</mx:VBox>
</mx:Panel>
</mx:Application>
**** Navigation.mxml (Component) **********
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="900" height="300" creationComplete="createMenu()"
horizontalAlign="center">
<mx:Script>
<![CDATA[
import mx.events.DragEvent;
import mx.core.DragSource;
import mx.managers.DragManager;
import mx.controls.Image;
import flash.events.MouseEvent;
[Bindable] public var numberMenuItems:Number = 3;
[Bindable] public var itemInfo_object:Object = new Object();
[Bindable] public var embedImage:Object = new Object();
private function createMenu():void
{
for (var i:int = 0; i<numberMenuItems; i++)
{
trace('entered loop');
// set item info
itemInfo_object[i] = new Object();
itemInfo_object[i].name = String("box"+i);
itemInfo_object[i].prices = String("prices for item "+i);
// create box image and add to HBox
embedImage[i] = new Image();
embedImage[i].id = String("box"+i);
embedImage[i].name = String(i);
embedImage[i].source = "_assets/boxTransparent.png";
embedImage[i].addEventListener("mouseDown",startDragFunc);
this.addChild(embedImage[i]);
}
}
private function startDragFunc(event:MouseEvent):void
{
var items:Object = new Object();
items.name = itemInfo_object[event.currentTarget.name].name;
items.prices = itemInfo_object[event.currentTarget.name].prices;
var ds:DragSource = new DragSource();
ds.addData(items,"items");
DragManager.doDrag(embedImage[event.currentTarget.name],ds,event);
}
private function dropTheData():void
{
}
// Handles calls to the DragManager
]]>
</mx:Script>
</mx:HBox>