JQuery的阿贾克斯形式在IE文件上传不工作(JQuery Ajax Form with File

我使用jQuery Ajax的形式上传文件，这在Chrome和Firefox的效果很好，但它不工作在IE。 它弹出窗口一个窗口，告诉我保存，我要上传的文件。

我的代码的例子，如果必要的话，是这里的仪式：HTML：

<div class="addNewDocumentContent">
<form id="AddNewDocForm" action="@Url.Action("AddNewDocument", "BidForm")" enctype="multipart/form-data" method="post">
<div>
    <input name="File" type="file" style="width: 80%;" />
</div>
<div>
    <label>
        @Labels.Name</label>
    <input type="text" name="Name" style="width: 80%;" />
</div>
<div style="text-align: right;">
    <button type="button" name="Back" value="Back">
       @Buttons.GoBack
    </button>
    <button type="submit" name="Add" value="Back">
        @Buttons.Add
    </button>
</div>
</form>

JS：

//Document Ready=============================================================================
$(function () { 

    $('#AddNewDocForm').ajaxForm({
        type: 'POST',
        beforeSubmit: function () {
            return $("#AddNewDocForm").valid();
        },
        success: function (documents) {
            FillDocuments(documents);
            $('#dialogAddNewDocument').dialog('close');
        }
    });
});
//Validate====================================================================================
//Validation=====================================================================================
$(function () {
    $("#AddNewDocForm").validate({
        ignore: ":not(:visible)",
        rules: {
            File: "required",
            Name: "required"
        }
    });
});
//=========================================================================================

行动

[HttpPost]
    public JsonResult AddNewDocument(DocumentModel document)
    {
        if (ModelState.IsValid)
        {
            List<DocumentModel> documents = null;
            if (Session["Documents"] != null)
            {
                documents = (List<DocumentModel>)Session["Documents"];
                var doc = documents.OrderByDescending(x => x.Number).Take(1).FirstOrDefault();

                document.Number = doc != null ? doc.Number + 1 : 1;
                document.FileName = document.File != null ? document.File.FileName : document.FileName;
                documents.Add(document);
            }
            else
            {
                documents = new List<DocumentModel>();
                document.Number = 1;
                document.FileName = document.File != null ? document.File.FileName : document.FileName;
                documents.Add(document);
                Session["Documents"] = documents;
            }

            var displaydocs = documents.Select(x => new
            {
                Name = x.Name,
                Number = x.Number,
                File = x.File != null ? x.File.FileName : x.FileName,
                Route = x.Route != null ? x.Route : "#",
            });

            return Json(displaydocs, JsonRequestBehavior.AllowGet);
        }
        else
        {
            return null;
        }
    }

最后模型：

  public class DocumentModel
{
    public int Number { get; set; }
    [Required]
    public string Name { get; set; }
    [Required]
    public HttpPostedFileBase File { get; set; }

    public string FileName { get; set; }
    public string Route { get; set; }
}

再次，它工作在IE8除了每一个浏览器。 林可能不是唯一的一个，但我还没有找到一个答案在那里。

Answer 1:

这个问题已经被问很多次 。 在发布前请搜索。 该文件明确指出它：

支持XMLHttpRequest的2级浏览器将能够无缝地上传文件，甚至得到进度更新的上传收益。 对于旧的浏览器，回退技术被用于涉及I帧，因为它无法上传使用水平XMLHttpRequest对象的1 implmenentation文件。 这是一种常见的后备技术，但它有内在的局限性。 IFRAME元素作为形式的提交操作的目标，这意味着服务器响应写入到iframe中。 这是好的，如果响应类型是HTML或XML，但如果数据类型是script或JSON，两者一般都需要用实体引用来repesented在HTML标记时发现字符不正常工作。

为了说明使用iframe的模式时，脚本和JSON响应的困难，这个插件允许嵌入到textarea元素，这些反应，所以建议你在一起选择与文件上传和老年人使用时，这些响应类型这么做浏览器。 但是请注意，如果有形式没有文件输入，则要求采用正常XHR提交表单（不是一个iframe）。 这给你的服务器代码的负担，知道何时使用一个textarea，何时不。

既然你是从你的控制器动作返回JSON你需要尊重的文件说什么=>包裹在一个<textarea>元素。

Answer 2:

我还没有一个textarea试过没，但如果我定义的内容类型的动作为text / html内返回正常工作：

 return new JsonResult() { ContentType = "text/html", Data = result };

Answer 3:

尝试添加缓存：您的AJAX调用内部的“假” ......是这样的：

 $.ajax({
 type:"POST", 
 url:'process.php',
 cache:'false',   //IE FIX
 data: data, 
 success: function(){ //on success do something...

 } 
 });

文章来源: JQuery Ajax Form with File Upload not working in IE