Quick Inquiry

Home >> Articles >> Asynchronous File Upload using handler in Asp.net Development

What is the Use Asynchronous file upload?

In Asp.net ajax, we have AsyncFileUpload control for uploading files asynchronously. But if you are using JQuery with your application then using AsyncFileUpload control is not a good practice to upload files asynchronously.

jQuery plugin and issue.

From last couple of days we were trying to find a way to upload file asynchronously using jQuery and Asp.net Handler. So, we have searched into google and find some jQuery plugins. First of all we found jQuery plugin from (http://www.phpletter.com/Demo/AjaxFileUpload-Demo/) this website which is forced upload file to the server asynchronously using asp.net handle.

Using above plugin in our code we have found the issue that plugin works properly into Firefox and Chrome browser but in IE there is a security issue. When I try to upload file that does not saved in proper location then we debug the handler file and see the file which is pass to handler that include “c:\fakepath\” into the path. So this is the security issue that IE does not allow asynchronously upload file or image with this plugin (http://www.phpletter.com/Demo/AjaxFileUpload-Demo/).

Now we have to find another plugin which also works into all latest browsers. So we found a way and got solution form CodeProject, there is one article which is very useful to upload file asynchronously using jQuery and Asp.net handler. Then we download sample code from GitHub (http://github.com/valums/file-uploader) and implement those into our project using following step.

How to implement in our project?

To implement Valums File Uploader pluing into asp.net project please follow following step.

1) Download sample project from GitHub using this link (http://github.com/valums/file-uploader).

2) Find and put fileuploader.js file into your project.



3) Find and put style from site.css file to your project.



4) Now add FileUpload handler file to your project and then you can set folder path when you want to save image asynchronously.



5) Create one new page. And just include fileuploade.js and site.css into your page.

6) Add file uploader div to your new created page.



7) Include following script in your script section.



8) Run your project, now you can see Upload file button by click on that button you can choose image from your local machine and save that image where you want without page refresh.



Conclusion

Main benefit of valums/file-uploader plugin is that provide browser compatibility. We can use in our asp.net application and it works in all latest browser like IE, Chrome, Firefox. So, developer does not need to worry about browser issue. Wishing you a great Microsoft .net development career ahead.


For further information, mail us at info@aegissofttech.com


Copyright © 2017 - aegisisc, All rights reserved