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

时间:2015-08-28 06:41:15

标签: c# asp.net asp.net-mvc asp.net-mvc-3 mvvm

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

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

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

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

我创建这个作为测试项目的原因是我需要看看HTML的外观,以便asp.net绑定器能够将它绑定到控制器后期操作。

如果您不理解上述问题,请随时提问。我会尽力回答。谢谢!

简化的示例类。

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")
}

1 个答案:

答案 0 :(得分:1)

EditorFor()方法会为HttpPostedFileBase的每个属性生成输入,而不是<input type="file" .../>EditorFor()方法使用TemplateHelpers来确定用于生成html的模板,遗憾的是没有与[DataType(DataType.Upload)]对应的模板

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

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

或为EditorTemplate类型创建HttpPostedFileBase,以便您可以使用EditorFor()方法

/Views/Shared/EditorTemplates/HttpPostedFileBase.cshtml

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