AS3 - how to get mouse events on embedded bitmaps? - actionscript-3

Question

I'm embedding an image, creating a grid, and trying to cast each embedded image as a DisplayObject so I can use MouseEvents on each image in the grid, however, I can't get a mouseEvent to work. Any help is greatly appreciated. I think I'm missing something simple perhaps.
public class ImageGrid extends Sprite
{
private var gridItems:Array;
private var grid:Sprite;
private var sprite:Sprite
private var reveals:uint = 0;
private var exceededNumReveals:SimpleText;
[Embed(source="../Assets/images/tile-grad5-108.png")]
public var imgCls:Class;
public function ImageGrid(tileSize:Number, numTiles:Number, rows:Number)
{
gridItems = new Array();
grid = new Sprite();
addChild(grid);
for (var i:int = 0; i < numTiles; i++) {
gridItems[i] = new imgCls() as DisplayObject;
trace(gridItems[i] is DisplayObject) //true
gridItems[i].rotation = 180
gridItems[i].x = (i % rows) * (tileSize)
gridItems[i].y = int(i / rows) * (tileSize)
gridItems[i].addEventListener(MouseEvent.CLICK, gridItemClick, false, 0, false);
grid.addChild(gridItems[i]);
}
}
private function gridItemClick (event:MouseEvent):void {
trace(event.currentTarget);
reveals ++
if (reveals < AssetManager.numReveals) {
TweenLite.to(event.currentTarget, 0.5, {y:900,rotation:Math.random() * 360, ease:Sine.easeOut});
} else {
exceededNumReveals = new SimpleText ('You have exceeded your number of reveals', false, false, null, true, true, false, null, null, 20, 'right');
exceededNumReveals.y = this.y + 300;
exceededNumReveals.x = this.x + 30;
addChild(exceededNumReveals)
}
}
}
}
Here is how I fixed it:
public function ImageGrid(tileSize:Number, numTiles:Number, rows:Number)
{
gridItems = new Array();
grid = new Sprite();
addChild(grid);
for (var i:int = 0; i < numTiles; i++) {
var imageHolder:Sprite = new Sprite()
gridItems[i] = new imgCls() as DisplayObject;
gridItems[i].rotation = 180
gridItems[i].x = (i % rows) * (tileSize)
gridItems[i].y = int(i / rows) * (tileSize)
imageHolder.addChild(gridItems[i]);
imageHolder.addEventListener(MouseEvent.CLICK, gridItemClick, false, 0, false);
grid.addChild(imageHolder);
}
}

Answer 1

Wrap them in an interactive object (MovieClip, Sprite, etc.) to add a Mouse Click Event to them. Bitmaps are not interactive objects.

Answer 2

bitmaps are not interactive objects, you will have to add the listener to the parent