Ajax file upload not working in IE7

问题

I've used this plugin for file upload via Ajax in asp.net mvc3. http://malsup.com/jquery/form/#ajaxSubmit But it won't work in IE7.

$("#Controls").submit(function () {
            var options = {
                url: "/Education/upDoc",
                datatype: "json",
                success: showResponse
            };
    $(this).ajaxSubmit(options);
});

function showResponse(responseText, statusText, xhr, $form) {
        alert("sr");
        alert("Sr  " + responseText.success);
        if (responseText.success == true) {
            //some code
        }
    }

<form action='' id='Controls' method='post' enctype='multipart/form-data'>
<table>
                        <tr> 
                        <td>File Type</td> 
                        <td><span class='leftten'></span></td> 
                        <td> 
                        @*<select id='documentType' name='documentType'> 

                        </select> *@
                        @Html.DropDownList("documentType", doctypelist, new { @id = "documentType" })
                        </td> 

                        <td><img src='../../img/AlertSign.jpg'  class='errImgDoc' data-style-tooltip='tooltip-shiny-red' title='' id='errFileType'  height='18px' width='20px'/></td> 
                        <td><span class='leftfortytwo'></span></td> 
                        <td><input type='file' id='file' name='file' /></td> 
                        <td><img src='../../img/AlertSign.jpg'  class='errImgDoc' data-style-tooltip='tooltip-shiny-red' title='' id='errFile'  height='18px' width='20px' /></td> 
                        <td><span class='leftfortytwo'></span></td> 
                        <td>Name</td> 
                        <td><span class='leftten'></span></td> 
                        <td><input type='text' id='description' name='description' /></td> 
                        </tr> 
                        </table> 
                        <br /> 
                        <div align='right'> 
                        <table><tr> 
                        <td><input type='button' id='eduUploadCancel' class='Cancel' onmouseover='CancelHover(this)' onmouseout='CancelMouseOut(this)' onclick='Cancel(this)' /></td><td><span class='leftten'></span></td><td><input type='submit' id='eduUploadSave' class='Save' onmouseover='SaveHover(this)' onmouseout='SaveMouseOut(this)' /></td></tr></table> 
                        </div>

</form>

Here,showResponse() is never called with IE7. Works fine on Chrome and Firefox.Please help!

回答1:

IE 7 is old browser and not support XMLHttpRequest Level 2.

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.

http://malsup.com/jquery/form/#file-upload

来源：https://stackoverflow.com/questions/10297309/ajax-file-upload-not-working-in-ie7