CODEWITHSUNDEEP
htmldrag-and-dropgmail
Andrew
Andrew

Reputation: 5213

Can HTML 5 drag-and-drop handle folders?

I'm impressed by Gmail's ability to let you drag files into emails for attachments, but when I try to drag a folder onto it, it says the file has 0 bytes. Is this a Gmail limitation, or is this something that's fundamentally not doable with the current HTML 5 spec?

Upvotes: 14

Views: 9638

Answers (2)

kongaraju
kongaraju

Reputation: 9596

Now directory upload available on chrome

you can select directory using input type

<input type='file' webkitdirectory >

and you can drag drop a folder 

<div id="dropzone"></div>

var dropzone = document.getElementById('dropzone');
dropzone.ondrop = function(e) {
  var length = e.dataTransfer.items.length;
  for (var i = 0; i < length; i++) {
    var entry = e.dataTransfer.items[i].webkitGetAsEntry();
    if (entry.isFile) {
      ... // do whatever you want
    } else if (entry.isDirectory) {
      ... // do whatever you want
    }
  }
};

Upvotes: 18

Nikolaus Gradwohl
Nikolaus Gradwohl

Reputation: 20124

The current draft of html5 only supports a file list object for handling the getData events. so you can drag multiple files to a drag target but no folders

Upvotes: 3

Related Questions