Я пытаюсь реализовать загрузку каталогов с помощью jQuery File Upload plugin от Blueimp. Rails 4 - мой бэкэнд, а для вложений я использую Carrierwave.
Проблема в том, что плагин jquery не может распознать папку, которую я загружаю. У меня уже есть параметр webkitdirectory, переданный в поле ввода. Может кто-нибудь помочь мне с этим?
Спасибо заранее.
Здесь код загрузки файла jQuery в application.js:
$('#fileupload').fileupload({
dataType: "script",
sequentialUploads: true,
// This function is called when a file is added to the queue;
// either via the browse button, or via drag/drop:
add: function(e, data) {
data.context = $(tmpl("template-upload", data.files[
0]))
data.context.addClass('working');
//$('.upload-status-box').addClass('working');
$('#Upload-Bar').append(data.context);
$('.upload-status-box').show();
// Listen for clicks on the cancel button
data.context.find('span.cancel-upload').click(
function() {
jqXHR.abort();
data.context.fadeOut(function() {
data.context.remove();
});
count = count - 1;
removeUploadStatusBoxOnCompletion();
});
var jqXHR = data.submit();
count = count + 1;
},
progress: function(e, data) {
if (data.context) {
$('.upload-status-box').show();
progress = parseInt((data.loaded / data.total) *
100);
var uploadMeta = parseInt(data.loaded / 1000000) +
"/" + parseInt(data.total / 1000000) +
" MB - " + progress + "%";
data.context.find('.progress-bar').css('width',
progress + '%');
data.context.find('.status').text(uploadMeta);
}
},
done: function(e, data) {
console.log(
'Your files have been uploaded successfully!'
);
// alert('Your files have been uploaded successfully! Depending on the file size, you might have to wait for a while before performing any actions.');
count = count - 1;
data.context.removeClass('working');
data.context.find('button.cancel-upload').hide();
removeUploadStatusBoxOnCompletion();
}
});
И вот мое поле ввода:
<div class="awesome-file-uploads" id="inline-upload-status">
<%= form_for [myfolder, Myfile.new], html: { multipart: true, :id => "fileupload" } do |f| %>
<%= f.file_field :attachment, multiple: true, id: "fileinput", style: "display:none;", "webkitdirectory"=> "", "directory"=> "" %>
<%= f.hidden_field :myfolder_parent_id, value: myfolder.id %>
<% end %>
Здесь приведен код для загрузки и обработки файлов внутри папки:
$('#folderupload').change(function(e) {
e.preventDefault();
NProgress.done();
var items = e.target.files;
var paths = ""; //
// var myfolder_id = $(this).parent();
for (var i=0, file; file=items[i]; i++) {
paths += file.webkitRelativePath+"###";
} //
// uploadFiles(items, myfolder_id.data('inside'));
$("#paths").val(paths);
$("#folderupload").submit(); //
});
function uploadFiles(items, myfolder_id){
xhr = new XMLHttpRequest();
data = new FormData();
paths = "";
var AUTH_TOKEN = $('meta[name=csrf-token]').attr('content');
data.append('authenticity_token', AUTH_TOKEN);
// Set how to handle the response text from the server
xhr.onreadystatechange = function(ev){
console.debug(xhr.responseText);
};
for (var i=0, file; file=items[i]; i++) {
paths += file.webkitRelativePath+"###";
data.append(i, file);
}
data.append('paths', paths);
xhr.open('POST', "/myfolders/"+myfolder_id+"/create_from_folder", true);
xhr.send(this.data);
}