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

时间:2019-11-15 12:48:03

标签: c# html asp.net-mvc input

我在同一视图上有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>
}

1 个答案:

答案 0 :(得分:2)

  

主要变化

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();
}

我已选择以下图像文件

UI

按如下图所示分别在控制器中获取文件

enter image description here