MVC 从不同的文件输入上传文件

Question

我在同一个视图上有 2 个不同的文件输入。我想从文件输入 A 传递多个文件，从文件输入 B 传递一个文件。截至目前，我的代码将允许我将 A 或 B 的内容传递给我的控制器，但不能同时传递两者。关于如何使这项工作的想法？请注意，我使用的是 MVC，页面上还有其他输入，而不仅仅是文件输入。

有一些未包含的 javascript 将第一个输入的文本更改为上传的单个文件的名称，或者会显示“选择了 3 个文件”。 javascript 没有什么特别的。

编辑：这正是我想做但我现在不能做的事情。我有 2 个用户可以上传到的不同文件输入。我需要两个文件输入才能传回控制器。不仅仅是一个文件输入。文件输入 A 具有 multiple 属性。它可以并且确实传回多个文件。但这不是问题，只有 A 或 B 会传回用户上传的文件。

public class ViewDesigner 
{
    public string FirstName { get; set; }
    public string MiddleName { get; set; }
    public string LastName { get; set; }
    public DateTime DateOfBirth { get; set; }      
    public List<File> Files { get; set; }
}

---

    [HttpPost]
    public ActionResult SignUp(ViewDesigner viewDesigner)
    {

        List<File> Files = new List<File>();
        if (ModelState.IsValid)
        {
            for (int i = 0; i < Request.Files.Count; i++)
            {
                var requestedFile = Request.Files[i];
                File file = new File()
                {
                    FileName = requestedFile.FileName
                };
                Files.Add(file);

            };

            viewDesigner.Files = Files;
        }

        return View();

    }

---

@using (Html.BeginForm("SignUp", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <b class="col-12">
        Upload up to 5 documents 
    </b>
    <small class="col-12">All files must be uploaded simultaneously.</small>
    <div class="form-group col-lg-12 my-3">
        <input type="file" id="file" name="file" accept="image/*, .gif, .xls, .doc, .docx, .pdf, .ppt" data-multiple-caption="{count} files selected" multiple="multiple" />
        <label for="file"><i class="fad fa-upload"></i> <span>Choose a file&hellip;</span></label>
    </div>


    <b class="col-12">
        Upload one document
    </b>
    <div class="form-group col-lg-12 my-3">
        <input type="file" id="file2" name="file2" accept="image/*, .gif, .xls, .doc, .docx, .pdf, .ppt" />
        <label for="file"><i class="fad fa-upload"></i> <span>Choose a file&hellip;</span></label>
    </div>
}

Answer 1

主要变化

public ActionResult SignUp(IEnumerable<HttpPostedFileBase> file, IEnumerable<HttpPostedFileBase> file2, ViewDesigner viewDesigner)

解释

在您的 cshtml 按钮中添加提交表单

@using (Html.BeginForm("SignUp", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <b class="col-12">
        Upload up to 5 documents
    </b>
    <small class="col-12">All files must be uploaded simultaneously.</small>
    <div class="form-group col-lg-12 my-3">
        <input type="file" id="file" name="file" accept="image/*, .gif, .xls, .doc, .docx, .pdf, .ppt" data-multiple-caption="{count} files selected" multiple="multiple" />
        <label for="file"><i class="fad fa-upload"></i> <span>Choose a file&hellip;</span></label>
    </div>


    <b class="col-12">
        Upload one document
    </b>
    <div class="form-group col-lg-12 my-3">
        <input type="file" id="file2" name="file2" accept="image/*, .gif, .xls, .doc, .docx, .pdf, .ppt" />
        <label for="file"><i class="fad fa-upload"></i> <span>Choose a file&hellip;</span></label>
    </div>
    <button type="submit"> submitt</button>
}

修改方法代码如下

[HttpPost]
public ActionResult SignUp(IEnumerable<HttpPostedFileBase> file, IEnumerable<HttpPostedFileBase> file2, ViewDesigner viewDesigner)
{
    return View();
}

我选择文件如下图

如下图分别获取控制器中的文件