Friday, April 20, 2012

Using HTML5 file uploads with AJAX and jQuery

Admittedly, there are similar questions lying around on SO. But it seems none quite meet my requirements. Here is what I'm looking to do:




  • Upload an entire form of data, one piece of which is a single file

  • Work with Codeigniter's file upload library



Up until here, all is well. The data gets in my database as I need it. Good good. But I'd also like to submit my form via an AJAX post:




  • Using the native HTML5 File API, not flash or an iFrame solution

  • Preferably interfacing with the low-level .ajax jQuery method



I think I could imagine how to do this by auto-uploading the file when the field's value changes using pure javascript, but I'd rather do it all in one fell swoop on for submit in jQuery. I'm thinking it's not possible to do via query strings as I need to pass the entire file object, but I'm a little lost on what to do at this point. Am I chasing a unicorn here?



Thanks so much for any help you could give.





No comments:

Post a Comment