I tried a couple of jQuery plugins for uploading a file. They can be found at:
http://www.phpletter.com/DOWNLOAD/ and http://lagoscript.org/jquery/upload.
I'm sure they work similarly in that they dynamically create an iframe with a form in it and then submit the data. The issue that I'm having is that when my JSON response comes back to the browser, the browser treats the output as a document rather than JSON and thus confusion ensues. On Internet Explorer/Firefox, it pops up a download dialog. On Chrome, it magically adds <pre> tags to the output and thus the JSON parser blows up. The most frustrating thing is that these plugins work perfectly on the site that they are demonstrated on.
Naturally one would suspect the code generating the output. I did too, but the output content looks fine. And the MIME type is being set exclusively, so there's no excuse for the browser to misinterpret this.
In fact, here's the content of my Controller that is passing the JSON back in case anyone was wondering:
[HttpPost]
public JsonResult Edit(String x, HttpPostedFileBase languagefile)
{
//Do a bunch of stuff that absolutely does not return from the method early.
return Json(new
{
outa= vara,
outb = varb,
outc = varc
});
}
So the MIME type is set to JSON, but for some odd reason, it's treating it as if it's a document anyway and not processing the content of the JSON request. Any clues?
Here's the actual response sent from the application as captured by Wireshark. I just don't get where these pre tags are coming from and why Internet Explorer and Firefox treat this the way they do:
HTTP/1.1 200 OK
Cache-Control: private, s-maxage=0
Content-Type: application/json; charset=utf-8
Server: Microsoft-IIS/7.5
X-AspNetMvc-Version: 2.0
X-AspNet-Version: 2.0.50727
X-Powered-By: ASP.NET
Date: Fri, 17 Sep 2010 20:46:23 GMT
Content-Length: 38
{"name":"","id":0,"response":"failed"}