0

I have an application which uses draggable and droppable jquery calls, essentially taking elements and putting them in buckets. That's fine, it works great. BUT, my customer has a requirement to take one of these elements and drop it OFF the browser, into notepad or word.

In a vanilla browser, if you drag an image off browser, you'll drop a relevant URL (if the image is clickable, the url of the A, or if not clickable, the source URL of the image). I need to retain this functionality with my draggable / droppable features. But I can't figure out how this is done. Currently, I can drag/drop normally within my container, but once I drag off browser, I get nothing. No url, nothing.

Anyone have an idea on this one?

howsyouredge
  • 23
  • 2
  • Once the image reaches the edge of the page, you could try to stop dragging, trigger a mouseup, remove the draggable and trigger a mousedown, in that order. – Asad Saeeduddin Oct 30 '12 at 16:26
  • Possible duplicate [jQuery draggable outside of browser](http://stackoverflow.com/questions/4566371/jquery-draggable-outside-of-browser) – Adam Tomat Oct 30 '12 at 16:27
  • @Adam, you're right. It is a dupe. I searched "off," he used "outside." Whoops. But that question was never answered. – howsyouredge Oct 30 '12 at 16:50
  • Have you had a read of the link @rcravens [posted](http://stackoverflow.com/questions/2308328/is-it-possible-to-drag-and-drop-images-between-web-sites-applications)? Other than that, I don't know if it's possible. – Adam Tomat Oct 30 '12 at 16:55
  • @Adam, yeah, I saw that one. Doesn't cut it. The post you originally linked mentioned the "disappearing element," which is my problem. The second link doesn't use jquery draggable and behaves like my "vanilla" description. The best answer so far is Asad, but that means possibly reversing that order if the user drags BACK into the browser (to a bucket). – howsyouredge Oct 30 '12 at 17:02
  • You're using jquery ui right? I'm not very experienced in drag and dropping but but does using [html5 help](http://www.w3schools.com/html/html5_draganddrop.asp)? – Adam Tomat Oct 30 '12 at 17:07

1 Answers1

0

I think we need more information here. What is the "element" in question that you are trying to drop? Is it a div, an img? What is the resulting text that you would like to appear in the application? Is it a direct representation of the object itself or is it some metadata of the object?

Your issue here may be the target application, which needs to understand the type of objects that are being dropped onto it. For example, if I select some text, or an image in some cases, from a web page and drag/drop it into Word, that works fine; it even brings across the formatting of a block of text to a degree. But it doesn't work into Notepad, because Notepad doesn't understand what to do when a "BlobOfHtmlData" object (for want of the correct Object Type) is dropped onto it.

Since you can't extend Notepad and tell it what to do with such an item, I think you're onto a looser with this one.

Martin Greenaway
  • 545
  • 4
  • 16
  • Currently, the draggable element is a . I'd love to drop a representation of the object but would settle on the html clob. Try dragging the demo box off the bottom of the [API page](http://api.jqueryui.com/draggable/). You'll see what I mean. – howsyouredge Oct 30 '12 at 17:23