mvc3使用ajax形式上传文件-Request.Files为空

Question

我使用 mvc3，并尝试创建一系列 ajax 表单，每个表单在一个页面内上传一个文件。这是页面的视图：

@{
    ViewBag.Title = "Index";
}
<h2>
    Index</h2>

    @Html.Partial("_UploadItem")
    @Html.Partial("_UploadItem")
    @Html.Partial("_UploadItem")

<script type="text/javascript">
    function Go() {
        // loop through form tags
        for (var n = 0; n < document.forms.length; n++) {
            var f = document.forms[n];
            // if a dress is chosen, a caption is chosen
            // and a file is chosen, then submit the ajax form
            if (f.dressid.value != '' &&
               f.dresscaption.value != '' &&
               f.fileitem.value != '')
                f.submit();
        }
    }
</script>
<input type="button" onclick="Go();"/>

然后 Go() 函数循环遍历 ajax 表单，检查每个表单上的所有 3 个部分（dressid、dresscaption 和 fileitem）是否都是非空的，并调用提交非空表单，启动异步上传。

这是部分视图：

@using SoRefeising.Models
@using (Ajax.BeginForm("UploadFile", new { }, new AjaxOptions { HttpMethod = "POST" }, new { enctype="multipart/form-data"}))
{
    List<SelectListItem> items = (List<SelectListItem>)ViewBag.Dresses;

    <span>Dress</span>
    @Html.DropDownList("dressid", items, "Choose Dress");
    <span>Caption</span>
    @Html.TextBox("dresscaption")
    <input type="file" id="fileitem" />    
}

我已经用 multipart 属性标记了每个表单。生成页面后，我得到以下信息：

<form action="/upload/UploadFile" data-ajax="true" data-ajax-method="POST" enctype="multipart/form-data" id="form0" method="post">    <span>Dress</span>
<select id="dressid" name="dressid"><option value="">Choose Dress</option>
<option value="1">Simpson01</option>
<option value="2">Simpson02</option>
</select>    <span>Caption</span>
<input id="dresscaption" name="dresscaption" type="text" value="" />    <input type="file" id="fileitem" />    
</form>

    <form action="/upload/UploadFile" data-ajax="true" data-ajax-method="POST" enctype="multipart/form-data" id="form1" method="post">    <span>Dress</span>
<select id="dressid" name="dressid"><option value="">Choose Dress</option>
<option value="1">Simpson01</option>
<option value="2">Simpson02</option>
</select>    <span>Caption</span>
<input id="dresscaption" name="dresscaption" type="text" value="" />    <input type="file" id="fileitem" />    
</form>

    <form action="/upload/UploadFile" data-ajax="true" data-ajax-method="POST" enctype="multipart/form-data" id="form2" method="post">    <span>Dress</span>
<select id="dressid" name="dressid"><option value="">Choose Dress</option>
<option value="1">Simpson01</option>
<option value="2">Simpson02</option>
</select>    <span>Caption</span>
<input id="dresscaption" name="dresscaption" type="text" value="" />    <input type="file" id="fileitem" />    
</form>

一切看起来都正常...

这是调用的控制器操作 调用

[HttpPost]
        public ActionResult UploadFile(string dressid, string dresscaption)
        {
                HttpPostedFileBase hpf = Request.Files[0] as HttpPostedFileBase;
...

该操作时，Request.Files 集合有 0 个项目，而不是选定的文件。我启用了不显眼的 javascript，不显眼的文件加载到母版页中，并在其他页面上运行。

我在论坛上看到过一些关于注意文件大小的消息。我正在测试的文件是 < 2k

知道为什么 Request.Files 中没有项目吗？

谢谢

Answer 1

您无法使用 AJAX 上传文件。因此，将 Ajax.BeginForm 替换为普通的 Html.BeginForm。您还可以查看以下博客文章 。

如果您想使用异步上传，您可以尝试一些可用的上传组件，例如 Ajax Upload 和 < a href="http://www.uploadify.com/" rel="noreferrer">上传。

Answer 2

首先，我不知道你为什么会出现三次这样的情况。

@Html.Partial("_UploadItem")
@Html.Partial("_UploadItem")
@Html.Partial("_UploadItem")

您是否正在尝试上传多个文件？有很多脚本可以让您非常有效地完成此操作。您还会生成多个表单，其中的字段包含相同的 ID。这不会影响上传过程，但这是不好的做法。我确实认为你需要重构上面的内容。无论如何，将部分视图中的字段更改为

<input type="file" name="file" />

我认为问题可能与您的实际操作以及您尝试检索文件的方式有关。试试这个

HttpPostedFileBase postedFile = Request.Files["file"];

让我知道是否有效。