javascript - Display image after selecting file -

javascript - Display image after selecting file -

<label id="lblfileuploadprofile"> <asp:fileupload runat="server" id="imageprofileupload" /> <asp:image runat="server" id="imgprofilepic" imageurl="img/user-5.png" />

i utilize upload image how display when upload done useing js ?

try approach:

<img id="blah" class="photo" imageurl="img/user-5.png" /> <label for="imginp" class="custom-file-upload"> <i class="fa fa-cloud-upload"></i>add image </label> <input type='file' id="imginp" name="image" /> <script> //preview & update image before uploaded function readurl(input) { if (input.files && input.files[0]) { var reader = new filereader(); reader.onload = function (e) { $('#blah').attr('src', e.target.result); } reader.readasdataurl(input.files[0]); } } $("#imginp").change(function () { readurl(this); }); </script> <style type="text/css"> input[type="file"] { display: none; } .custom-file-upload { border: 1px solid rgb(197, 197, 197); border-radius: 4px 4px 4px 4px; display: inline-block; padding: 6px 12px; cursor: pointer; float: right; width: 5.25em; margin-left:200px; } .photo{ width: 7em; height: 9em; border: 1px solid rgb(197, 197, 197); border-radius: 4px 4px 4px 4px; float:right; } </style>

hope helps...

javascript c# asp.net image-uploading