画像をクリックするとアップロードダイアログを表示する方法

Question

私のインデックスページには、写真アルバムを表すいくつかの画像があります。これらの画像は各アルバムのカバーです。

私は、ユーザーがこれらの表紙画像をクリックするだけでその表紙画像を変更できるようにしたいと考えています。そのため、ファイルダイアログがポップアップし、ユーザーは新しいカバーイメージを選択できます。

これまでのアプローチでは、画像をアップロードし、クリックするとファイルダイアログを表示する非常に基本的なフォームを使って部分を作成していました。

_cover.html.erb 

<%= form_for(album) do |f| %> 
    <div class="field"> 
    <%= f.file_field :image %> 
    </div> 
<% end %> 

リンク部分については、ファイルダイアログをどのようにトリガーするのか分かりませんでした。このような何かが明らかに動作しませんが、それは私が達成しようとしているどのようなアイデアを与える必要があります。

ところで

<%= link_to (image_tag album.image_url), render partial: 'cover', locals: {album: album}, action: :update_cover %> 

を、私が作成、簡単なアップロードボタンを使用して、そのフォームに新しいカバーをアップロードすることができました私の例からrender partial ...部分によって。

Answer 1

私はいくつかの研究の後でそれを理解しました。私にとっては、アップロードのトリガーとして欲しかった画像を<label>タグに貼り付けるのが最善の解決策でした。

<label> 
    <input name="album[image]" id="album_image" type="file"> 
    <img src="path_to_image" alt="my_image" width="200" height="200">   
</label> 

本当に簡単ですが、私が読んだものから、私がテストしていないことと、いくつかのIE < 11問題、があるようです。