Drag and drop elements into an iframe. Droppable area has wrong coordinates and collisions are wrong

Question

I need to implement drag and drop functionalities in a web application between elements present in a web page, and elements inside an iframe (before you start complaining ab

Answer 1

This is not a "silver bullet" , but I'll go ahead and post this as an answer, but I'm not sure how much value it will have for you. I tracked down a key function in jQuery UI that might be what you're looking for. It's in $.ui.ddmanager (the drag and drop manager), and the function is prepareOffsets. This line:

m[i].offset = m[i].element.offset();

seems to be the one that is setting up the offset for use when the element is actually dropped. This might be a place to fiddle with to adjust the resulting offset based on whether the droppable element is a child of the iframe.

There is another function above it $.ui.intersect that performs the logic to see if the draggable and droppable are intersecting each other.

I'm in the latest release of jQuery UI, and the file is jquery-ui-1.8.14.custom.js on line 2012-2029. If you get the single droppable file itself, jquery.ui.droppable.js, it's on lines 203-220. And these are the dev files, not the min files.