将 ViewModel 与包含 HttpPostedFileBase 的 ViewModel 列表绑定到控制器操作

Binding ViewModel with a list of ViewModels including HttpPostedFileBase to controller action

好的,所以我会尽力解释我目前面临的问题。

我想要一个创建视图,它是 ViewModel 的强类型。 ViewModel 有一些属性,其中一个是列表,包含另一种 ViewModel。该 ViewModel 包含更多属性,以及一个 HttpPostedFileBase 类型的值。

createView 应该包含列表中每个 viewModel 的文件输入。所有其他属性都将对用户隐藏。唯一需要用户交互的是 HttpPostedFileBase。

问题是,首先,我无法让 EditorFor 创建文件输入,相信我,我已经试过了。其次,我需要为强类型 viewModel(下面的 TestViewModel)列表中的每个条目执行此操作,以便它可以将值绑定回 post.

上的控制器

我创建这个作为测试项目的原因是我需要查看 HTML 的外观,以便 asp.net 活页夹能够将其绑定到控制器 post 动作。

以上问题如有不明白之处欢迎提问。我会尽力回答。谢谢!

简化示例类。

public class TestViewModel
{
    public string SomeString { get; set; }
    public int SomeInt { get; set; }
    public List<ImageViewModel> ImageViewModels { get; set; }
}

public class ImageViewModel
{
    [DataType(DataType.Upload)]
    public HttpPostedFileBase Value { get; set; }
}

创建视图(简化,我知道。这是一个测试项目)

@model WebApplication1.Models.TestViewModel

@{
    ViewBag.Title = "Create";
}

<h2>Create</h2>


@using (Html.BeginForm("Create", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>TestViewModel</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })

        <div>
            <table>
                <tr>
                    <th>Image</th>
                </tr>
                @for (int i = 0; i < Model.ImageViewModels.Count; i++)
                {
                    <td>@Html.EditorFor(m => m.ImageViewModels[i].Value)</td>
                }
            </table>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

EditorFor() 方法将为 HttpPostedFileBase 中的每个 属性 生成一个输入,而不是 <input type="file" .../>EditorFor()方法使用TemplateHelpers来决定使用哪个模板生成html,可惜没有对应[DataType(DataType.Upload)]

您可以使用以下内容创建输入

@Html.TextBoxFor(m => m.ImageViewModels[i].Value, new { type = "file" })

或者为 typeof HttpPostedFileBase 创建一个 EditorTemplate 以便您可以使用 EditorFor() 方法

/Views/Shared/EditorTemplates/HttpPostedFileBase.cshtml

@model HttpPostedFileBase
@Html.TextBoxFor(m => m, new { type = "file" })