Can I use HTML Drag and Drop file uploads, but without AJAX / XHR?

I have a form that accepts drag and drop events, but everything I read on the internet, it seems to imply that you can not download the file discharged as part of the standard presentation forms, for example <input type="file" />. Is it really possible to avoid AJAX / XHR and just upload the file when submitting the form? Perhaps moving file data to file?

Thanks,
Daniel.

+4
source share
1 answer

This can be done using jQuery. Here is a sample code:

$(document).on("dragover drop", function(e) {
e.preventDefault();  // allow dropping and don't navigate to file on drop
}).on("drop", function(e) {
$("input[type='file']")
    .prop("files", e.originalEvent.dataTransfer.files)  // put files into element
    .closest("form")
      .submit();  // autosubmit as well
});

" ". JsFiddle, : http://jsfiddle.net/qMmPr/

, .

+2

All Articles