與蜻蜓多圖像上傳

Question

我想在rails3中與蜻蜓多圖像上傳。我搜索了一些教程，但找不到任何。我發現有Carrierwave多圖片上傳的教程，但無法找到與蜻蜓運氣..任何幫助，請:)

Answer 1

前言

Dragonfly本身可以用來管理媒體在一般項目中，類似於paperclip 。這個問題本身歸結爲一個rails應用程序中的多個文件上傳。有關這個主題的一些教程可用，它可以很容易地適用於使用Dragonfly在其上存儲特定文件的模型。我建議你看看這些，並嘗試適應你的項目。但是，我可以展示一個我爲當前正在開發的rails 3.2應用程序構建的最低示例，它並非完美（例如驗證處理），但可以給出一些出發點。

例

只是爲了參考，基本思想是從here服用。這個例子是用Rails 3.2.x完成的。

假設您有度假數據庫，用戶可以在其中創建休假報告。他們可能會留下一些小的描述以及一些照片。

通過建立對旅行的簡單的基於ActiveRecord的模型開始了，讓我們只是把它Trip現在：

class Trip < ActiveRecord::Base 
    has_many :trip_images 
    attr_accessible :description, :trip_images 
end 

正如你可以看到，該模型已經通過has_many協會連接到它的行程圖像。讓我們來簡單看一下TripImage模型，它採用蜻蜓具有存儲在內容領域的文件：

class TripImage < ActiveRecord::Base 
    attr_accessible :content, :trip_id 
    belongs_to :trip_id 

    image_accessor :content 
end 

跳閘圖像它的自我保存文件附件。您可以在此模型中放置任何約束，例如文件大小或MIME類型。

讓我們創建一個TripController具有new和create行動（你可以，如果你想通過腳手架生成此，它是迄今爲止沒有任何幻想）：

class TripController < ApplicationController 
    def new 
     @trip = Trip.new 
    end 

    def create 
     @trip = Trip.new(params[:template]) 

     #create the images from the params 
     unless params[:images].nil? 
      params[:images].each do |image| 
      @trip.trip_images << TripImages.create(:content => image) 
     end 
     if @trip.save 
      [...] 
    end 
end 

這裏沒有什麼特別，與創建例外來自另一個條目的圖像比params哈希。這在文件上傳領域new.html.erb模板文件中尋找時纔有意義（或您使用的Trip模型的字段部分）：

[...] 
<%= f.file_field :trip_images, :name => 'images[]', :multiple => true %> 
[...] 

這應該在目前的工作，但是，也有現在沒有限制這個權利的圖像。您可以在Trip模型通過custom validator限制在服務器端的圖像數量：

class Trip < ActiveRecord::Base 
    has_many :trip_images 
    attr_accessible :description, :trip_images 
    validate :image_count_in_bounds, :on => :create 

protected 
    def image_count_in_bounds 
     return if trip_images.blank? 
     errors.add("Only 10 images are allowed!") if trip_images.length > 10 
    end 
end 

我離開這個給你，但你也可以對文件中的字段使用客戶端驗證，一般的想法會是在改變文件字段（CoffeeScript中），以檢查文件：

jQuery -> 
    $('#file_field_id').change() -> 
     #disable the form 
     for file in this.files 
      #check each file 
     #enable the form 

摘要

你可以建立很多從現有的教程，如蜻蜓不表現不同的方式對其他解決方案時，它來到只是上傳文件。但是，如果你想要更有趣的東西，我建議jQuery Fileupload，就像我之前的其他人一樣。

無論如何，我希望我能提供一些見解。

LG，

FLO