Web browsers supporting only XMLHTTPRequest Level 1 are not so uncommon and if you want to upload file using AJAX you should follow a few simple rules.
Let’s consider the example on the jqForm website. As explicitly explained, there are some limitations for old browsers when you need to get a JSON response back from server.
“Browsers that support the XMLHttpRequest Level 2 will be able to upload files seamlessly and even get progress updates as the upload proceeds. For older browsers, a fallback technology is used which involves iframes since it is not possible to upload files using the level 1 implmenentation of the XMLHttpRequest object. This is a common fallback technique, but it has inherent limitations. The iframe element is used as the target of the form’s submit operation which means that the server response is written to the iframe. This is fine if the response type is HTML or XML, but doesn’t work as well if the response type is script or JSON, both of which often contain characters that need to be repesented using entity references when found in HTML markup.”
Official jqForm documentation suggests to modify the server side code to let it send back the JSON data between a
I don’t dislike their solution but I found an alternative that worked worked pretty well in a couple of my web apps and maybe it is simpler.
Server Side Code (Php)
1 2 3 4 5 6 7 8 9 10
As you can see, I have voluntarily not specified the response Content-Type to workaround the problem we are addressing.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28
Don’t set the Content-Type in the server response and let jQuery intelligently guess the response content type ( take a look at datatype option specifications ).