C# – How to upload an image when fileupload control is under updatepanel

For solve this problem, Please see the following step.

1. Add ajax-upload to your detail view.
   • iframe-based uploader like Resource#1.
   • Silverlight-based & Flash-based uploader. I like this technique because it doesn't require any server-side script for display current upload status. But in HTML5, you can create this without using any web browser plug-in.
   • Commercial uploader like Resource#2. that use hidden iframe for uploading.

2. Upload file to temporary location.

   • System response the temporary location. Next, client keep temporary location in hidden input in detail form.
   • Keep temporary location with session_id. You can store it in database or Session variable depend on your framework.

3. When you click on the save button, the system will move the files to their real location

Note. System will automatically delete the expired file from the temporary location.

Resource

1. ASP.NET File Upload with Real-Time Progress Bar
2. ASP.NET File Upload like GMail (Commercial)

Update

After almost one year, I just found a great 3rd-parties control for this question. This is an open source plug-in of jQuery. It name Plupload that allows you to upload files using HTML5, Silverlight, Flash or normal forms and it provide some unique features such as upload progress, image resizing and chunked uploads.

You can try & test Plupload by click here.

unfortunately due to javascript sandboxing you will need to post the entire page