Drag & Drop Function Not Working - Flash - actionscript-3

Question

I am trying to create a function in ActionScript that shall trigger an event when a drag-gable object is dropped over another object.
var hits = 0;
// Register mouse event functions
answer_j.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
answer_j.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
answer_e.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
answer_e.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
answer_m.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
answer_m.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
answer_b.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
answer_b.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
answer_a1.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
answer_a1.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
answer_t.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
answer_t.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
answer_a2.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
answer_a2.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
answer_n.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
answer_n.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
// Define a mouse down handler (user is dragging)
function mouseDownHandler(evt:MouseEvent):void
{
var object = evt.target;
// limit dragging to the area inside the canvas
object.startDrag();
}
function mouseUpHandler(evt:MouseEvent):void {
var obj = evt.target;
// obj.dropTarget will give us the reference to the shape of
// the object over which we dropped the circle.
var target = obj.dropTarget;
// If the target object exists the we ask the test_match function
// to compare moved obj and target where it was dropped.
if (target != null)
{
test_match(target, obj);
}
obj.stopDrag();
}
function test_match(target,obj) {
// test if either one of the four pairs match
if ( (target == box_j && obj == answer_j) ||
(target == box_e && obj == answer_e) ||
(target == box_m && obj == answer_m) ||
(target == box_b && obj == answer_b) ||
(target == box_a1 && obj == answer_a1) ||
(target == box_t && obj == answer_t) ||
(target == box_a2 && obj == answer_a2) ||
(target == box_n && obj == answer_n) )
{ // we got a hit
hits = hits+1;
textField.text = "Yes ! You got one !";
// make the object transparent
obj.alpha = 0.5;
// kill its event listeners - object can't be moved anymore
obj.removeEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
obj.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
// Test if we are done
if (hits == 8) {
textField.text = "Made it !!";
}
} else {
textField.text = "Missed :(";
}
}
box_j - box_n are the objects that shall be the target for the drag-gable objects.
However, for certain unknown reasons the above code won't work. Kindly please advise if you know how to resolve it.
All object are in "movie clip" type.

Answer 1

Just change the order inside your mouseUpHandler function.
Stop the drag before you reference the dropTarget when this don't work you should add .parent to the dropTarget:
function mouseUpHandler(evt:MouseEvent):void {
var obj = evt.target;
obj.stopDrag();
// obj.dropTarget will give us the reference to the shape of
// the object over which we dropped the circle.
var target = obj.dropTarget;
//var target = obj.dropTarget.parent;
// If the target object exists the we ask the test_match function
// to compare moved obj and target where it was dropped.
if (target != null) {
test_match(target, obj);
}
}
EDIT:
This is why you have to use .parent sometimes:
When you put the target on the stage in the authoring mode and not
through AS then the dropTarget property will reference the Shape. To
get the instance of the MovieClip or Sprite that contains the
Shape you need to use the parent parameter.