4

我正在使用 Jquery Ajax Form 上传文件，在 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 之外的所有浏览器。我可能不是唯一一个，但我还没有找到答案。

4

3 回答 3

4

这个问题已经被问过很多次了。发帖前请先搜索。文档清楚地说明了这一点：

支持 XMLHttpRequest Level 2 的浏览器将能够无缝上传文件，甚至在上传过程中获得进度更新。对于较旧的浏览器，使用涉及 iframe 的后备技术，因为无法使用 XMLHttpRequest 对象的 1 级实现来上传文件。这是一种常见的后备技术，但它具有固有的局限性。iframe 元素用作表单提交操作的目标，这意味着将服务器响应写入 iframe。如果响应类型是 HTML 或 XML，这很好，但如果响应类型是脚本或 JSON，则效果不佳，这两种类型通常都包含在 HTML 标记中找到时需要使用实体引用来表示的字符。

为了解决使用 iframe 模式时脚本和 JSON 响应的挑战，Form Plugin 允许将这些响应嵌入到 textarea 元素中，建议您在与文件上传和旧版本结合使用时对这些响应类型这样做浏览器。但是请注意，如果表单中没有文件输入，则请求使用普通 XHR 提交表单（不是 iframe）。这给你的服务器代码增加了知道什么时候使用 textarea 什么时候不使用的负担。

由于您从控制器操作返回 JSON，因此您需要尊重文档中所说的 => 包装在<textarea>元素中。

于 2012-06-28T07:19:49.073 回答
3

我还没有尝试过使用 textarea，但如果我将内容类型定义为在操作中返回为 text/html，它就可以正常工作：

 return new JsonResult() { ContentType = "text/html", Data = result };
于 2012-06-28T21:30:25.263 回答
0

尝试在您的 AJAX 调用中添加 cache:'false' ......类似于： 

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

 } 
 });
于 2012-06-27T21:36:10.923 回答