Click here to Skip to main content
15,915,083 members
Please Sign up or sign in to vote.
5.00/5 (1 vote)
See more:
Hi, this is Danny.

Currently, I'm trying to find alternative way to upload multiple files and files in folder. (IE)

It is using ActiveX now but our team want to revise Web Site without any kind of ActiveX.

I already found several ways which could be running on Chrome but There is nothing about IE.

What I have tried:

To upload multiple files,

input multiple="multiple" id="xFilePath" type="file" name="filename[]" runat="server" /

but there is no way to upload or select files in folder.
(Actually there is, but it's not working on IE)


To upload multiple files by dragging and dropping,

$(document).ready(function () {

var prc = $("#btnFileUpload");
var obj = $("#dragandrophandler");
var files = "";

obj.on('dragenter', function (e) {
e.stopPropagation();
e.preventDefault();
$(this).css('border', '2px solid #0B85A1');
});
obj.on('dragover', function (e) {
e.stopPropagation();
e.preventDefault();
});

// prc.on('click', function (e) {
// $(this).css('border', '2px dotted #0B85A1');
// e.preventDefault();
// var files = e.originalEvent.dataTransfer.files;

// //We need to send dropped files to Server
// handleFileUpload(files, obj);
// });


//$('#btnFileUpload').click(function (e) {
prc.on('click', function (e) {
//$(this).css('border', '2px dotted #0B85A1');
//e.preventDefault();
//var files = e.originalEvent.dataTransfer.files;

//We need to send dropped files to Server
handleFileUpload(files, obj);
});

obj.on('drop', function (e) {

// running on Chrome
// //var files = e.originalEvent.dataTransfer.files;
// var items = event.dataTransfer.items;
// for (var i = 0; i < items.length; i++) {
// // webkitGetAsEntry is where the magic happens
// var item = items[i].webkitGetAsEntry();
// if (item) {
// traverseFileTree(item);
// }
// }

// if (e.originalEvent.dataTransfer.types != null) {
// for (var i = 0; i < e.originalEvent.dataTransfer.types.length; i++) {
// //console.log("... types[" + i + "] = " + e.dataTransfer.types[i]);
// alert(e.originalEvent.dataTransfer.types[i]);
// }
// }

$(this).css('border', '2px dotted #0B85A1');
e.preventDefault();
//var files = e.originalEvent.dataTransfer.files;
files = e.originalEvent.dataTransfer.files;

SetFileName(files, obj);

//We need to send dropped files to Server
//handleFileUpload(files, obj);
});
$(document).on('dragenter', function (e) {
e.stopPropagation();
e.preventDefault();
});
$(document).on('dragover', function (e) {
e.stopPropagation();
e.preventDefault();
obj.css('border', '2px dotted #0B85A1');
});
$(document).on('drop', function (e) {
e.stopPropagation();
e.preventDefault();
});


$("#xFilePath").change(function (e) {
$("#myFileList").children().remove();


$("#myFileList").css('border', '2px dotted #0B85A1');
e.preventDefault();
//var files = e.originalEvent.dataTransfer.files;
files = e.target.files;

SetFileName(files, obj);
});


This can upload multiple files by dragging and dropping files,

but what I want to find out is bringing files in folder.


If you could give me any idea or solutions, It's gonna be really appreciated.

Thanks in advance.
Posted
Updated 5-Oct-16 15:48pm

1 solution

Check following-
Dropzone.js[^]

It works on IE too but supports no folder upload, it's still a file uploader. I am not sure if you will find a uploader which can upload folder. I belive if you need to you upload a folder then you have to zip it and upload it.

Hope, it helps :)
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900