当单个部分需要多个对象时,如何从视图中动态地将项添加到我的集合中？

Question

我有一个在我的视图中显示的项目列表.我需要能够通过添加按钮从UI手动添加项目到此列表.我知道我需要使用javascript加载局部视图以显示新项目.

@{var count = 0;}
@foreach (var dx in Model.Patient.DxList)
{    
    <div class="form-field">
        <label>@(++count)</label>
        @Html.HiddenFor(d => dx.DxIndex)
        @Html.TextBoxFor(d => dx.Dx, new { @class = "small" })
        <span class="description">@((dx.DxRef != null) ? dx.DxRef.Title : "")</span>
        @Html.DropDownListFor(d=> dx.Indicator, new SelectList(Model.Codes, "Value", "Description", dx.Indicator), "Please select", new { @class = "" })
    </div>
}

但是,因为我的项目包含TextBox和DropDownList(使用代码填充),我的部分视图是否也需要ViewModel？不仅要包含Dx,还要包含创建列表的相应代码列表？

public class DxSingleViewModel
{
    public Dx Dx { get; set; }
    public List<Code> Codes { get; set; }
}

不知道这是否是一般方法,或者我是否偏离基础.

Answer 1

您应该将一项的渲染分离到一个单独的部分视图/编辑器模板，并在 foreach 循环中调用它，这样您就只有一个地方可以为一项定义标记：

@foreach (var dx in Model.Patient.DxList)
{
    @Html.EditorFor(m => dx)
}

然后你的AddNewItem操作可以返回一个只调用的部分视图@Html.EditorForModel()

动态添加和删除行时，您应该将自己的索引（例如 guid 字符串）嵌入到项目中以避免冲突。看看这篇很棒的文章，它解释了如何使用自定义 html 帮助器来实现这一点：http://blog.stevensanderson.com/2010/01/28/editing-a-variable-length-list-aspnet-mvc-2 -风格/

您的编辑器模板将如下所示：

@using (Html.BeginCollectionItem("DxList"))
{
    @Html.TextBoxFor(d => dx.Dx, new { @class = "small" })
    ....
}

关于您关于视图模型是否应包含下拉列表的问题：视图模型应包含渲染视图所需的所有数据。所以我想说是的，这是将列表传递给视图的好地方。

当然，你也可以在视图袋中传递它，但我是强类型数据袋的朋友，所以我更喜欢视图模型。