jquery - Drag-Drop elements between parent frame and child iframe

Question

I am trying to drag-drop elements between parent frame and iframe using jQuery. I have a panel in parent frame which contains some draggable items which can be dropped on the child frame. I tried to search a lot but couldn't find much...

I tried to work around it by appending the element inside the child frame and then trying to trigger draggable on the newly inserted element programmatically, but I got stuck there as well. Couldn't find the proper way to trigger the drag function. (The draggable element has a helper. When I trigger drag by triggering "mousedown.draggable" the position on the ui-draggable element changes but I cannot see the helper.

Thanks!!

Answer 1

Using HTML5 Drag and Drop API to create Cross Frame and Cross Browser Implementation. http://blog.stackhive.com/post/137799349684/building-a-seamless-drag-and-drop-interface

EDIT - The previous link wasn't valid (dockPHP got rebranded as StackHive) so have written out a more complete post that can help in creating an epic drag and drop interface.