rails3.1でremotipartでAjaxファイルアップロード

Ajaxでのファイルアップロードでremotipartなるものを使って見ました。
https://github.com/leppert/remotipart

使い方は簡単でGemfileにgemを追加します。

gem 'remotipart'

次にapp/assets/javascripts/application.jsに1行追加してやります。

//= require jquery
//= require jquery_ujs
//= require jquery.remotipart
//= require_tree .

テスト用にControllerとViewを作りました。
remotipartはActionDispatch::Http::UploadedFileをパラメータとして渡してくれます。

class SamplesController < ApplicationController
  
  def new
    @sample = Sample.new
  end
 
  def create
    @sample = Sample.new
    @sample.update_attributes(params[:sample])
    if @sample.save
      render 'create' and return
    else
      render 'new'
    end
  end
  def upload
    if remotipart_submitted?
      file = params[:upload][:file]
      orig = file.original_filename
      ft = File.open(file.tempfile)
      File.open(orig, 'wb') {|fn| fn.write(ft.read)}
    end
    
    respond_to do |format|
      format.js
    end
  end
end

new.html.erb

<h1>Sample Upload</h1>
<%= form_for @sample do |f| %>
<%= f.label :name %>
<%= f.text_field :name %>
<%= f.submit %>
<% end %>
<%= form_for :upload, :url => {:action => 'upload'}, :html => { :multipart => true }, :remote => true do |f| %>
  <div class="field">
    <%= f.label :file %>
    <%= f.file_field :file %>
  </div>
  <div class="actions">
    <%= f.submit 'Upload File'%>
  </div>
<% end %>

うまくアップロードできたらalertを出すようにjs.erbファイルも作りました。upload.js.erb

<%= remotipart_response do %>
  // Display a Javascript alert
  alert('success!');
<% end %>

簡単ですね。