Preview an image before it is Uploaded #asp.net #javascript #image

Preview an image before it is Uploaded.md

Preview an image before it is Uploaded

---

Preview an image before it is uploaded in ASP.NET using Javascript

ASP.NET Code

<asp:FileUpload ID="File_Userimage" runat="server" onchange="showpreview(this);" />

Java Script Code

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>

<script type="text/javascript">
    
    function showpreview(input) {
        
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
                $('#' + '<%= Image1.ClientID %>').css('visibility', 'visible');
                $('#' + '<%= Image1.ClientID %>').attr('src', e.target.result);
            }
            reader.readAsDataURL(input.files[0]);
        }
    }

</script>