jquery drag, drop and clone, find dropped position of element

Question

Here, is my fiddle for jquery drag, drop and clone feature.

Problem:

My problem is: when ever I drop element, it is showing:

position: {top: 0, left: 0}

only for draggable, clone and droppable element.

I have also written code for finding position using only draggable function and that is working fine. I want this behavior in draggable, droppable with clone feature

Please visit JSFiddle

fiddle

full-screen output

Answer 1

Finally, resolved the problem. The problem was, I was using ui.draggable.position(); for storing dropped position to database, which was wrong.

The actual position we need to store is:

// position of the draggable minus position of the droppable
// relative to the document
leftPosition  = ui.offset.left - $(this).offset().left;
topPosition   = ui.offset.top - $(this).offset().top;

Reference: How do I get the coordinate position after using jQuery drag and drop?

Updated Jsfiddle with working example

http://jsfiddle.net/przbadu/rkvdffe3/18/

http://jsfiddle.net/przbadu/rkvdffe3/18/embedded/result/