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.