Image thumbnail show before upload in web application

Image thumbnail show before upload

When you are creating a user friendly web application you need to focus on user friendly interfaces.
Here I try to give you small tip to show a thumbnail before upload the images.

First in your form you need to create file input and image tag to preview thumbnail.

    <form id="form1" runat="server">
        <input type='file' id="imgInp" />
        <img id="blah" src="#" alt="your image" />

Then this is the javascript and jquery code you need to implement.

function readURL(input) {
if (input.files &amp;&amp; input.files[0]) {
var filereader = new FileReader();

filereader.onload = function (e) {



Hope this thumbnail preview works well in your side.