[英]Upload multiple files with parameters in ASP.NET Core
My view model: 我的视图模型:
public class FileInfo
{
[Required]
[StringLength(50, ErrorMessage = "TitleErrorMessage", MinimumLength = 2)]
public string Title { get; set; }
[Required]
[StringLength(100, ErrorMessage = "DesErrorMessage", MinimumLength = 3)]
public string Description { get; set; }
[Required]
[DataType(DataType.Upload)]
public IFormFile File { get; set; }
}
The following is _UploadForm partial view file: 以下是_UploadForm部分视图文件:
@model SessionStateTest.Models.FileInfo <div class="form-group"> <label>Title</label> <input class="form-control" asp-for="Title" /> </div> <div class="form-group"> <label>Description</label> <input class="form-control" asp-for="Description" /> </div> <div class="form-group"> <label></label> <input type="file" asp-for="File" /> </div>
That is used in another View with this code: 在另一个具有以下代码的视图中使用:
<form asp-action="AddUploadForm" asp-controller="Home" method="Post"> <input type="submit" value="Add another file" class="btn btn-sm btn-primary" /> </form> <form asp-action="Upload" asp-controller="Home" method="Post" enctype="multipart/form-data"> @foreach (var item in Model.Upload) { @(await Html.PartialAsync("_UploadForm", item)) } <div class="col-xs-12"> <input type="submit" value="Upload" class="btn btn-sm btn-info" /> </div> </form>
Basically AddUploadForm
action adds a new view model of type FileInfo
to Model.Upload
which is my main view model. 基本上,
AddUploadForm
操作将类型为FileInfo
的新视图模型添加到Model.Upload
,这是我的主要视图模型。 The problem is that the list List<FileInfo> vm
in Upload
action below is totally empty: 问题是,以下“上
Upload
操作中的列表List<FileInfo> vm
完全为空:
[HttpPost]
[ValidateAntiForgeryToken]
public IActionResult Upload(List<FileInfo> vm)
{
.... some other logic
return View();
}
I don't want to use multiple
attribute because I would like to force user to provide a title and description for every file. 我不想使用
multiple
属性,因为我想强迫用户为每个文件提供标题和描述。
Any help is kindly appreciated! 任何帮助,感激不尽!
Your approach with using _UploadForm
generates the following html (let's focus on input
's only since this is the most important part) 您使用
_UploadForm
方法将生成以下html(仅关注input
因为这是最重要的部分)
<input class="form-control" name="Title" />
<input class="form-control" name="Description" />
<input type="file" name="File" />
...
<input class="form-control" name="Title" />
<input class="form-control" name="Description" />
<input type="file" name="File" />
... and so on
So name
attributes contains only FileInfo
model's properties names without indexes and this is only suitable for the case when your controller expects single model 因此,
name
属性仅包含FileInfo
模型的属性名称,不包含索引,这仅适用于控制器希望使用单个模型的情况
public IActionResult Upload(FileInfo vm)
And in order to make your html work with your current controller with list of models 并且为了使您的html与当前的控制器一起使用,并带有模型列表
public IActionResult Upload(List<FileInfo> vm)
It should look like this 它应该看起来像这样
<!-- version 1 -->
<input class="form-control" name="[0].Title" />
<input class="form-control" name="[0].Description" />
<input type="file" name="[0].File" />
...
<input class="form-control" name="[1].Title" />
<input class="form-control" name="[1].Description" />
<input type="file" name="[1].File" />
... and so on
Or 要么
<!-- version 2 -->
<!-- the name before index must match parameter name in controller -->
<input class="form-control" name="vm[0].Title" />
<input class="form-control" name="vm[0].Description" />
<input type="file" name="vm[0].File" />
...
<input class="form-control" name="[1].Title" />
<input class="form-control" name="[1].Description" />
<input type="file" name="vm[1].File" />
... and so on
This is possible to accomplish using tag helpers and partial view in slightly different way. 这可以通过使用标签助手和部分视图来完成,方法略有不同。 All you need to do is turn partial view's model to list and update
asp-for
expressions. 您需要做的就是打开局部视图的模型以列出和更新
asp-for
表达式。
_UploadForm.cshtml _UploadForm.cshtml
@model List<SessionStateTest.Models.FileInfo>
@for (int i = 0; i < Model.Count; i++)
{
<div class="form-group">
<label>Title</label>
<input class="form-control" asp-for="@Model[i].Title" />
</div>
<div class="form-group">
<label>Description</label>
<input class="form-control" asp-for="@Model[i].Description" />
</div>
<div class="form-group">
<label></label>
<input type="file" asp-for="@Model[i].File" />
</div>
}
View 视图
<form asp-action="Upload" asp-controller="Home" method="Post" enctype="multipart/form-data">
@await Html.PartialAsync("_UploadForm", Model.Upload)
<div class="col-xs-12">
<input type="submit" value="Upload" class="btn btn-sm btn-info" />
</div>
</form>
It will generate html like in version 1 . 它将像版本1一样生成html。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.