asp.net mvc - XMLHttpRequest different in IE8 vs. FireFox/Chrome -
i'm having problem similar jquery $.ajax not working in ie8 works on firefox & chrome, different use case.
i'm using jquery form plug-in handle file upload asp.net mvc controller, sends file off parsing , processing. if exception thrown, should alert user issue.
//client side code //make ajax call, sending contents of file $("#ajaxuploadform").ajaxsubmit({ datatype: 'json', url: '/plan/something/excelimport', iframe: true, beforesend: function () { $(".ui-dialog-buttonpane").find("#my_progress").fadein(); }, success: function (data, textstatus) { output = "<center><span class='flash'>" + data.message + "</span></center>"; $("#flash_message").html(output).fadein('slow'); settimeout(function () { $("#flash_message").fadeout() }, 5000); cleanup(); }, error: function (xmlhttprequest, textstatus, errorthrown) { alert("xmlhttprequest " + xmlhttprequest); var contents = ""; (prop in xmlhttprequest) { contents += "\na property " + prop + " it's value " + xmlhttprequest[prop]; } alert("the contents " + contents); alert("textstatus " + textstatus); alert("errorthrown " + errorthrown); //comes in html envelope. should parsed regex, can't work. dirty hack response = xmlhttprequest.responsetext.substring(xmlhttprequest.responsetext.indexof("<body>")); response = response.replace("<body>", ""); response = response.replace("</body>", ""); alert("there problem upload.\r\n" + response); }, complete: function (xmlhttprequest, textstatus) { $(".ui-dialog-buttonpane").find("#my_progress").remove(); something_import.dialog('close'); something_import.dialog('destroy'); } }); //server side code public fileuploadjsonresult excelimport() { fileuploadjsonresult result = new fileuploadjsonresult(); httppostedfilebase hpf = request.files[0] httppostedfilebase; if (hpf.contentlength == 0) return new fileuploadjsonresult { data = new { message = "file contained no data" } }; string filename = path.getfilename(hpf.filename); string timestampedfile = filename.insert(filename.indexof('.'),"_"+datetime.now.tofiletimeutc()); string savedfilename = path.combine(appdomain.currentdomain.basedirectory + "tempo", timestampedfile); hpf.saveas(savedfilename); try { result = processfile(savedfilename, request["id"]) fileuploadjsonresult; } catch (argumentexception e) { this.response.statuscode = 500; this.response.statusdescription = system.net.httpstatuscode.badrequest.tostring(); response.write(e.message); result = json(new { message = e.message, stacktrace = e.stacktrace }) fileuploadjsonresult; } return result; } this works in chrome , firefox. in ie, xmlhttprequest object coming different:
ff:
ie: 
i've been googling around differences between browser implementations of xmlhttprequest, haven't found deals case. stymied.
the reason happening because of iframe fallback strategy ajaxsubmit employs. think since response gets posted iframe ie tries figure out how dipslay , decides wants ask download response instead of putting in iframe.
i came across same situation while ago , found article (that can't find now) offered workaround.
if surround json response in textarea nobody going complain(ie,ff,chrome,probably safari) , you'll response parsed correctly.
e.g. if returning
{id: 1, name: 'me'} just return:
<textarea>{id: 1, name: 'me'}</textarea> you see ie thinks it's html inserts hidden iframe. ajaxsubmit function still gets called , parses json correctly , everybody's happy. :)
if you're using asp.net mvc shamelessly copy extension method :)
public static class controllerextensions { public static actionresult jsonsafe(this icontroller controller, object obj) { javascriptserializer serializer = new javascriptserializer(); return new writeresult(string.format("<textarea>{0}</textarea>", serializer.serialize(obj))); } }
Comments
Post a Comment