ドラッグアンドドロップでファイルをアップロードする方法について調べてHTML5 FileAPIをjQueryと絡めて使うのがよさそうだなという結論に至った。
理解するのに時間かかりそうな感じ。javascriptというかイベント駆動というかそういうところ苦手すな。勉強せな
1から作るのを今回は断念してjquery-fileupload-railsを使ってみた。
jquery-fileupload-railsはjQuery-File-UploadというライブラリをRails上で簡単に使えるようにした物(という認識)
ドキュメント等は基本的にjQuery-File-Uploadの方を参照すればよさそう。
- jquery-fileupload-rails
- jQuery-File-Upload
ファイルアップロードする仕組みはCarrierWaveで実現していてその実装の上にドラッグアンドドロップできるように実装する。
下記内容をそれぞれ追記
Gemfile
group :assets do gem 'jquery-fileupload-rails' end
app/assets/javascripts/application.js
//= require jquery-fileupload/basic
jsにドラッグアンドドロップされた時にリクエストを送りたいDOMにfileupload()
$(function() { $('#hoge').fileupload(); });
これで#hogeにファイルがドロップされたら通信を送るようになった。