使用把手显示 mvc 中的对象列表

Question

我有一个模型，其中包含一个对象列表作为其属性之一，我正在尝试弄清楚如何让它们正确发布。这是一个带有 MVC 4 的 jQuery Mobile 项目，但我试图弄清楚 Handlebars 是否是显示列表的方法，或者是否有使用 html 帮助器的方法。

发生的情况是用户将选择他们有多少孩子，并且对于每个孩子，需要有一个年龄下拉菜单，如果他们年满 18 岁，则需要一个烟草使用复选框。我有两个类，Person 和 Child 来封装这些数据，它们之间的唯一区别是年龄范围。

Handlebars 方法如下：

<script type="text/x-handlebars-template" id="ChildTemplate">

         <div class="childWrapper">
            <label for="Children[{{id}}].Age">Child Age:</label>
            <select name="Children[{{id}}].Age" id="Children[{{id}}].Age" class="childDropdown">
                <option>0</option>
                <option>1</option>
                <option>2</option>
                <option>3</option>
                <option>4</option>
                <option>5</option>
                <option>6</option>
                <option>7</option>
                <option>8</option>
                <option>9</option>
                <option>10</option>
                <option>11</option>
                <option>12</option>
                <option>13</option>
                <option>14</option>
                <option>15</option>
                <option>16</option>
                <option>17</option>
                <option>18</option>
                <option>19</option>
                <option>20</option>
                <option>21</option>
                <option>22</option>
                <option>23</option>
                <option>24</option>
                <option>25</option>
            </select>

            <div class="childSmoker">
                <label for="Children[{{id}}].Smoker">Tobacco User?</label>
                <input type="checkbox" name="Children[{{id}}].Smoker" id="Children[{{id}}].Smoker" />
                <input type="hidden" name="Children[{{id}}].Smoker" value="false" />

            </div>
        </div>

    </script>

这适用于添加和提交可变数量的子项，但在发布时，复选框值始终为 false，我无法找到解决方法。我已经尝试过使用和不使用隐藏字段，但我似乎无法连接到复选框更改事件，我认为 jQuery Mobile 以某种方式干扰。

我尝试的另一种方法是创建一个编辑器模板，该模板的模型是子对象列表，但我不断收到运行时错误。这是模板中的代码。

<script type="text/x-handlebars-template" id="ChildTemplate">
    <div class="childWrapper">
        @Html.EditorFor(m => m.Children)
    </div>
</script>

这是我创建的模板。它在 Shared/EditorTemplates/Child.cshtml 下

@model List<MyCompany.Models.Child>

@foreach(var c in Model)
{
@Html.LabelFor(m => c.Age)
@Html.DropDownListFor(m => c.Age, c.Ages)

@Html.LabelFor(m => c.Smoker)
@Html.CheckBoxFor(m => c.Smoker)
}

它给我的错误是：传递到字典中的模型项的类型为“PreferredOneMobileMVC.Models.Child”，但该字典需要类型为“System.Collections.Generic.List`1”的模型项。除了使它成为单个实例的编辑器之外，我无法弄清楚如何绕过它，但这让我回到了我开始的地方。这是页面最初绑定到的模型：

    public Person Self  { get; set; }
    public Person Spouse { get; set; }
    public List<Child> Children { get; set; }
    public string County { get; set; }

    [Display(Name = "Coverage Begin Date:")]
    public virtual string CoverageDate { get; set; }

    [Display(Name = "Covered Members:")]
    public virtual string CoverageSelection { get; set; }


    public SelectList EffectiveDates { get; set; }


    public SelectList CoveredMembers { get; set; } 

    public SelectList Counties { get; set; }

我认为，如果我不能使用编辑器模板，那么下一个最佳解决方案是弄清楚如何将把手语法与 html 助手一起使用。我最初的方法是

@html.LabelFor(m => m.Children[{{id}}].Age)
@Html.DropDownListFor(m => m.Children[{{id}}].Age, Model.Children[{{id}}].Ages)

但是 html 助手不想使用 Handlebars，我无法构建它。关于最佳方法的任何建议？谢谢。

Answer 1

我明白了。如果我在模板中使用不使用 lambda 的助手，它就可以工作。这是新模板。

<script type="text/x-handlebars-template" id="ChildTemplate">

     @Html.Label("p[{{id}}].Age")
    <select name="p[{{id}}].Age" id="p[{{id}}].Age">
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
    </select>
    <div>
        @Html.Label("p[{{id}}]].Smoker")
        @Html.CheckBox("p[{{id}}].Smoker")
    </div>

</script>

只要我保持 id 顺序，我就可以添加/删除任意数量的内容。我的控制器方法接受List<Person>，现在所有内容都已正确发布。