Drag and drop a file then POST to a URL using HTML5

Question

I have figured out the drag and drop part but how would I then upload and POST the file to a URL with set parameters?

If I had a form I would just

   <form enctype="multipart/form-data" method="post"  action="url">  
 <input type="?" name="?"/>  
 <input type="?" name ="?" value="?"/>  
 </form>

How would I do above using the HTML5 drag and drop API???

I would like to drag and and drop an image into the browser and have it upload to a website — Kenshi
– Kenshi, Commented Sep 11, 2010 at 17:06

Cristian Sanchez · Accepted Answer · 2010-09-11 17:19:12Z

1

I think this MDC tutorial is what you're looking for: https://developer.mozilla.org/en/Using_files_from_web_applications

It discusses the drag/drop operation up to uploading the file with the new local file support.

answered Sep 11, 2010 at 17:19

Cristian Sanchez

32.4k11 gold badges59 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Cristian Sanchez Over a year ago

@Kenshi: Hopefully that's enough, but it would be important to say that I don't think you can add any data from the drop to a fileinput -- you would have to upload that through an AJAX request.

Collectives™ on Stack Overflow

Drag and drop a file then POST to a URL using HTML5

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related