Steps for Upload Image in folder using Fileupload Control in Asp.net using Jquery

Thank you for reading this post, don't forget to subscribe!

1. Add script to Design Page Head

<script type=”text/javascript”>
function readURL(input) {
var id = input.id;
var path = input.value;
var file = path.split(“\\”);
var filename = file[file.length – 1];
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$(“#” + id).after(“<span><img src=’loading.gif’/></span>”);

$.post(‘Handler Path to send data’, { FileData: e.target.result, fileName: filename },
function (result) {
$(“#” + id).next().remove();
alert(result);
});
}
reader.readAsDataURL(input.files[0]);
}
}
</script>

//Use Loader image to show loading while uploading

//Loader Image : loading.gif

2. Add Control to Form

<input type=”file” id=”myfile1″ runat=”server” onchange=”readURL(this);” />

3. Add Generic Handler class file to your project

Click on Image to display big

Handler