Tuesday, March 11, 2008

Uploading file asynchronously using ajax-like-technology

My boss asked to me to modify my popup container to allow the user uploading the file. I use ajax to submit data to the server. The response from the server I use a json format indicating a success or failure, validation errors, required login, .... Now, this won't work any more because XMLHTTPRequest object cannot handle file upload. To upload the file to the server asynchronously just like GMail and Yahoo Mail, you need to create an iframe and the set the target attribute of that form element to that new iframe. Then, on the onload event of that iframe, you can know that response from the server is completed or not. I have found another link related to this issue that quite fit to my need, but the server code of this technique is PHP. http://www.devbox.info/upload-files-asynchronously-using-ajax-like-technology
Anyway, I have modified a little bit to make it fit to my needs. One of the pitfalls is that it creates an iframe every time the user submit the form, but this doesn't matter you can modify by yourself. At last, I want to say thanks to the author of that page.

No comments:

Subscribe in a Reader