admin管理员组文章数量:1323553
I am using dropzone.js for uploading multiple files. Using this I can able to select multiple files from a folder and on selecting multiple files I will only select a set of files from my list.
Instead, I need to select a folder(directory)
I can able to drag and drop the folder. The same functionality I should do when I click on the dz-clickable
My Html code
<div class="dropzone dz-clickable" id="myDrop">
<div class="dz-default dz-message" data-dz-message="">
<span>Upload or drag your files here</span>
</div>
</div>
My Javascript code
var myDropzone = new Dropzone("div#myDrop", {
addRemoveLinks: true,
autoProcessQueue: false,
parallelUploads: maxParallelCount,
url: "#",
transformFile: function transformFile(file, done) {
zip = new JSZip();
zip.file(file.name, file);
zip.generateAsync(
{
type:"blob",
pression: "DEFLATE"
}
).then(function(content) {
done(content);
});
},
init: function() {
this.on("addedfile", function(file) {
if (jQuery.inArray(file.name, addedfiles) > -1) {
myDropzone.removeFile(file);
}
if (jQuery.inArray(file.name, DOC_NAMES) == -1) {
myDropzone.removeFile(file);
}
else {
addedfiles.push(file.name);
queueCount += 1;
}
});
this.on("removedfile", function(file) {
console.log(file.name);
if (jQuery.inArray(file.name, addedfiles) > -1) {
// addedfiles.pop(file.name);
var indOfAddedFiles = addedfiles.indexOf(file.name);
console.log("indOfAddedFiles -> "+ indOfAddedFiles);
addedfiles.splice(indOfAddedFiles, 1);
queueCount -= 1;
}
})
}
How can I choose a directory and do my process accordingly? Any Ideas ?
I am using dropzone.js for uploading multiple files. Using this I can able to select multiple files from a folder and on selecting multiple files I will only select a set of files from my list.
Instead, I need to select a folder(directory)
I can able to drag and drop the folder. The same functionality I should do when I click on the dz-clickable
My Html code
<div class="dropzone dz-clickable" id="myDrop">
<div class="dz-default dz-message" data-dz-message="">
<span>Upload or drag your files here</span>
</div>
</div>
My Javascript code
var myDropzone = new Dropzone("div#myDrop", {
addRemoveLinks: true,
autoProcessQueue: false,
parallelUploads: maxParallelCount,
url: "#",
transformFile: function transformFile(file, done) {
zip = new JSZip();
zip.file(file.name, file);
zip.generateAsync(
{
type:"blob",
pression: "DEFLATE"
}
).then(function(content) {
done(content);
});
},
init: function() {
this.on("addedfile", function(file) {
if (jQuery.inArray(file.name, addedfiles) > -1) {
myDropzone.removeFile(file);
}
if (jQuery.inArray(file.name, DOC_NAMES) == -1) {
myDropzone.removeFile(file);
}
else {
addedfiles.push(file.name);
queueCount += 1;
}
});
this.on("removedfile", function(file) {
console.log(file.name);
if (jQuery.inArray(file.name, addedfiles) > -1) {
// addedfiles.pop(file.name);
var indOfAddedFiles = addedfiles.indexOf(file.name);
console.log("indOfAddedFiles -> "+ indOfAddedFiles);
addedfiles.splice(indOfAddedFiles, 1);
queueCount -= 1;
}
})
}
How can I choose a directory and do my process accordingly? Any Ideas ?
Share Improve this question edited Jun 6, 2018 at 12:55 Sri asked Jun 5, 2018 at 14:11 SriSri 1,5053 gold badges18 silver badges36 bronze badges3 Answers
Reset to default 4Just to provide context to solution by @Sri
$("div#dropzoneDiv").dropzone({
url: '/upload',
init: function() {
this.hiddenFileInput.setAttribute("webkitdirectory", true);
}
});
Let me answer my question
Choosing folder is achieved by setting attribute webkitdirectory
as true
in hiddenFileInput
Along with the type
attribute, add like
_this3.hiddenFileInput = document.createElement("input");
_this3.hiddenFileInput.setAttribute("type", "file");
_this3.hiddenFileInput.setAttribute("webkitdirectory", true);
I don't think Dropzone.js allows to upload a whole directory (or it's not specified in their doc)
本文标签: htmlJavascript dropzonejsChoosing a Folder for file uploadStack Overflow
版权声明:本文标题:html - Javascript dropzone.js - Choosing a Folder for file upload - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742120186a2421658.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论