AS3 startDrag() only drags part of MC....leaves children (buttons and texts) behind

Question

I have a MC of a Timer that I created. Inside the MC there are buttons to set a countdown time and to clear it, some buttons to start and reset the timer, and a dynamic text field to display the time. Each of the buttons have event listeners and detailed code inside.

On the stage, I have a button, that does an addchild(timer) to the stage, and then I make it draggable. However, when I drag it, only my first layer, the background layer drags, and the rest of the movie clip stays put. I added a button mode to the timer, but the hand only shows up over the background, not over the area where the time text is. Is there something else I should be doing to drag the entire container around the screen?

function addATimer(event:MouseEvent):void
{
    var _timer:mc_timer = new mc_timer;
    dragArray.push(_timer);
    _timer.x = 260;
    _timer.y = 157;
    _timer.buttonMode = true;
    addChild(_timer);
    _timer.addEventListener(MouseEvent.MOUSE_DOWN, startDragging);
    trace (dragArray);
}


// function for the start dragging event. 
function startDragging(event:MouseEvent):void
{
    draggedObject = MovieClip(event.target)
    draggedObject.startDrag();
    stage.addEventListener(MouseEvent.MOUSE_UP, stopDragging);  
}


//function to stop the draggable object.  
function stopDragging(event:MouseEvent):void
{
    draggedObject.stopDrag();
    stage.removeEventListener(MouseEvent.MOUSE_UP, stopDragging);   
}

Thank you!

Answer 1

The problem is that event.target references whatever you clicked on (which can also be a child of the DisplayObjectContainer that you added the listener to.

event.currentTarget on the other hand is always a reference to the object that you added the listener to.

In your case, it makes sense to add the code related to drag&drop functionality to the class mc_timer.