Распарсивание мультифайлового ипута
Задача:
Есть мультифайловый инпут, после выбора изображений в диалоговом окне этот инпут ремовится, вместо него появляется n-ное количество синглфайловых инпутов. Кофискрипт: $(document).on 'change', '.jsPublicationImagesMultiupload', -> images = $(@).get(0).files for i in [0..images.length-1] createImageBlocks(images[i]) createImageBlocks = (image) -> $('#addPublicationImage').click() block = $('.jsPublicationImages').find('.fields').last() inputOld = block.find('.jsImageInput') inputNew = $('<input>').attr({ type: 'hidden', id: inputOld.attr('id'), name: inputOld.attr('name') # ??? }) inputNew.appendTo(block); inputNew.appendTo(block); inputOld.remove() getPreview(block.find('.jsPublicationImage'), image) Сам инпут получается распарсить на изображения и даже сделать из них превьюхи через FileReader. Но мои попытки сгенерировать инпуты, которые бы содержали ссылки на каждый выбранный файл, окончились плачевно. |
Пока что нашел только одно решение.
Делаю по добавлению файлов обычные хидден инпуты с файлнеймами, а потом уже после парсинга параметров формы сверяю файлнеймы в инпутах с массивом в мультизагрузчике. И если они совпадают, то подставляю файл. |
Цитата:
2. Есть куча плагинов позволяющих перетаскивать файлы Drag and drop, с сохранением имени... 3. Сделать набор файловых сингло инпутов, с z-index:-1;position:relative;(кроме первого), по событию onchange, скрывать текущий (z-index:-1);, и открывать следущий z-index:0 |
Цитата:
Разные инпуты нужны потому что кроме самих файлов для каждой модели изображения отправляется еще ряд параметров. 2. Про перетаскиевание вообще речи не было. 3. Это процесс последовательной, а не мультизагрузки. ----- По сабж: Распарсивание в контроллере оказалось самым удобным вариантом. Сначала создаем фейковые поля с нужными name и value для последующего заполнения файлами в контроллере: $(document).on 'change', '.jsPublicationImagesMultiupload', -> #... images = $(@).get(0).files for i in [0..images.length-1] createImageBlocks(images[i]) #... createImageBlocks = (image) -> #... inputNew = $('<input>').attr({ type: 'hidden', name: inputOld.attr('name') # берем правильный адрес отправки параметра из сгенерированого заранее инпута. value: image.name + image.type }) #... #... Тем временем в контроллере: # Обновляем параметры перед отправкой в логику params[:event][:publication_images_attributes].to_a.each do attr_publication| params[:images].to_a.each do |image| attr_publication[1][:image] = image if attr_publication[1][:image].to_s == (image.original_filename.to_s + image.content_type.to_s) end end # В добрый путь @event = Event.new(params[:event]) |
Часовой пояс GMT +3, время: 00:30. |