Rails form Images -
this form :
<%= form_for @user, validate: true |f| %> <div class="well-lg"> <h4>personal details</h4> <div class="form-group"> <%= f.label :role %> <br /> <%= f.select :role, options_for_role, {}, prompt: 'select one',:class=> 'form-control' %> </div> <div class="form-group"> <%= f.label :first_name %><br /> <%= f.text_field :fname, :class=> 'form-control' %> </div> <div class="form-group"> <%= f.label :last_name %><br /> <%= f.text_field :lname, :class=> 'form-control' %> </div> <div class="form-group"> <%= f.label :email_address %><br /> <%= f.email_field :email, :class=> 'form-control' %> </div> <div class="form-group"> <%= f.label :upload_image %><br /> <%= f.file_field :orgimg, :class => 'fileupload' %> <div id = 'dvpreview> </div> </div> </div> <% end %>
everything works fine wanted preview image uploaded in form how can add image_tag file field or there other solution??
thanks !!!
by using following code , able preview image while uploading
<script language="javascript" type="text/javascript"> $(function () { $(".fileupload").change(function () { if (typeof (filereader) != "undefined") { var dvpreview = $("#dvpreview"); dvpreview.html(""); var regex = /^([a-za-z0-9\s_\\.\-:])+(.jpg|.jpeg|.gif|.png|.bmp)$/; $($(this)[0].files).each(function () { var file = $(this); if (regex.test(file[0].name.tolowercase())) { var reader = new filereader(); reader.onload = function (e) { var img = $("<img />"); img.attr("style", "height:100px;width: 100px"); img.attr("src", e.target.result); dvpreview.append(img); } reader.readasdataurl(file[0]); } else { alert(file[0].name + " not valid image file."); dvpreview.html(""); return false; } }); } else { alert("this browser not support html5 filereader."); } }); });
Comments
Post a Comment