У меня есть file_field_tag
внутри формы рельсов с полем выбора файла:
<%= file_field_tag "attachments[media_files][]", multiple: true, id: "files" %>
И у меня есть область для предварительного просмотра изображений / видео и удаления при необходимости:
<span id="result"></span>
Все работает правильно, но есть только один глюк .... Если изображения / видео находятся в разных папках, мне нужно сначала добавить файлы из одной папки, а затем из другой папки. Но после этого процесса сохраняется только вторая партия файлов.
Вот javascript для всего вышеперечисленного:
window.onload = function(){
//Check File API support
if(window.File && window.FileList && window.FileReader)
{
var filesInput = document.getElementById("files");
filesInput.addEventListener("change", function(event){
var files = event.target.files; //FileList object
var output = document.getElementById("result");
for(var i = 0; i< files.length; i++)
{
var file = files[i];
//Allowed files
//if (!file.type.match(/.(jpg|jpeg|png|gif|mp4|avi|flv|wmv|mov|tiff|bmp|exif)$/i))
//continue;
var picReader = new FileReader();
picReader.addEventListener("load",function(event){
var picFile = event.target;
var span = document.createElement("span");
span.innerHTML = ['<img class="thumb" src="', picFile.result, '" title="', picFile.name, '"/><span class="remove_img_preview"></span>'].join('');
output.insertBefore(span,null);
span.children[1].addEventListener("click", function(event){
span.parentNode.removeChild(span);
});
});
//Read the image
picReader.readAsDataURL(file);
}
});
}
else
{
console.log("Your browser does not support File API");
alert("Your browser does not support File API")
}
}
Есть идеи как исправить этот глюк ??