javascript - Preview image before upload with Carrierwave -
I have a form where the user can create a new picture I have done it successfully with carrier usage. I was thinking that Is it possible to preview the image selected in the browser before uploading? I have made some efforts with javascript but have not worked for me.
This is the code for image uploading with CarrierView:
photo =: html = & gt; {: Multipurpose = & gt; True} what? F | & Gt%; & Lt;% = f.file_field: Image% & gt; & Lt; Div class = "field" & gt; & Lt;% = f.label: name% & gt; & Lt; Br> & Lt;% = f.text_field: name% & gt; & Lt; / Div & gt; & Lt; Div class = "field" & gt; & Lt;% = f.label: Details% & gt; & Lt; Br> & Lt;% = f.text_area: Details% & gt; & Lt; / Div & gt; & Lt; Div class = "verb" & gt; & Lt;% = f.submit "Save Photo"% & gt; & Lt; / Div & gt; & Lt;% end% & gt;
My goal is to have a small thumbnail of the image so that users can view it before uploading. I'm guessing that I can not use rail here because it can only be for server side ...
Any ideas? :)
If you are using Bootstrap 3 then there is a great extension for it
Comments
Post a Comment