Image thumbnail show before upload in web application

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" />
    </form>

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

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

filereader.onload = function (e) {
$('#thumbnail').attr('src', e.target.result);
}

filereader.readAsDataURL(input.files[0]);
}
}

$("#imagefile").change(function(){
readURL(this);
});

Hope this thumbnail preview works well in your side.