为什么 EditorTemplate 不显示数据？答案

【问题标题】：Why isn't the EditorTemplate showing the data?为什么 EditorTemplate 不显示数据？
【发布时间】：2012-07-06 22:52:10
【问题描述】：

我重写了我的页面以使用 EditorTemplates。他们非常好。但是，当我回发时，只有第一行回发数据。其他 4 行显示为空。 FormSection 有一个 FormRowModel 列表。 FormRows 有一个 CtrlInputDataModels 列表。我的代码如下。

索引

@model InspectionWebFormsMVC.ViewModels.FormSection

@{
    ViewBag.Title = "Testing Editor Templates";
}

<h2>Test Control for Webforms</h2>

@Html.EditorFor(x => x.sectionRows, "FormRowModel")

EditorTemplate/FormRowModel

@model InspectionWebFormsMVC.ViewModels.FormRowModel

@using (Html.BeginForm("Index", "TestEdit", FormMethod.Post))
{
    int i = 0;

    //var testCtrls = Model.Where(x => x.RowInput.Where(y => types.Contains(y.RowCtrl.Type)));
    <div style="clear:both; padding:1%;">       
        <div class="section">
            @Model.Section
        </div>
        <div class="number">
            @Model.SectionNumber
        </div>
        <div class="desc">
            @Model.Description
        </div>
        <div class="ctrl">  
            @{
                List<string> types = new List<string>() { "dropdown", "text", "radio", "checkbox" }             
                @Html.EditorFor(y => y.RowInput.Where(z => types.Contains(z.RowCtrl.Type)), "CtrlInputDataModel")
            }
        </div>

EditorTemplate/CtrlInputDataModel

@model InspectionWebFormsMVC.ViewModels.CtrlInputDataModel

@{
    var ddv = new SelectList(Model.RowCtrl.DefaultValues, "Value", "Label");

    switch (Model.RowCtrl.Type)
    {
        case "dropdown":
            //@Html.DropDownListFor(blah => Model.InputtedData, ddv)
            //@Html.HiddenFor(blah => Model.InputtedDataID)
            //@Html.HiddenFor(blah => Model.RowCtrl.CtrlTypeID)

            @Html.DropDownList("InputtedData", ddv)                                   
            @Html.Hidden("InputtedDataID", Model.InputtedDataID)
            @Html.Hidden("CtrlTypeID", Model.RowCtrl.CtrlTypeID)
            <br /> 
        break;
        case "text":
            //@Html.TextBoxFor(blah => Model.InputtedData)
            //@Html.HiddenFor(blah => Model.InputtedDataID)
            //@Html.HiddenFor(blah => Model.RowCtrl.CtrlTypeID) *@

            @Html.TextBox("InputtedData", Model.InputtedData)
            @Html.Hidden("InputtedDataID", Model.InputtedDataID)
            @Html.Hidden("CtrlTypeID", Model.RowCtrl.CtrlTypeID)  
            <br /> 
        break;
        case "radio":
            foreach (var sli in ddv)
            {
                //@Html.LabelFor(blah => Model.InputtedData, sli.Text)
                //@Html.RadioButtonFor(blah => Model.InputtedData, sli.Value)

                @Html.Label("InputtedData", sli.Text)
                @Html.RadioButton("InputtedData", Model.InputtedData, sli.Value)
            }
            //@Html.HiddenFor(blah => Model.InputtedDataID)
            //@Html.HiddenFor(blah => Model.RowCtrl.CtrlTypeID)

                @Html.Hidden("InputtedDataID", Model.InputtedDataID)
                @Html.Hidden("CtrlTypeID", Model.RowCtrl.CtrlTypeID)                                     
                <br /> 
        break;
        case "checkbox":
            foreach (var sli in ddv)
            {
                //@Html.LabelFor(blah => Model.InputtedData, sli.Text)
                //@Html.RadioButtonFor(blah => Model.InputtedData, sli.Value)

                @Html.Label("InputtedDataID", sli.Text)
                //@Html.CheckBox("InputtedData", false)

            }
                //@Html.HiddenFor(blah => Model.InputtedDataID)
                //@Html.HiddenFor(blah => Model.RowCtrl.CtrlTypeID)

                @Html.Hidden("InputtedDataID", Model.InputtedDataID)
                @Html.Hidden("CtrlTypeID", Model.RowCtrl.CtrlTypeID)   
                <br />
        break;
    }
}

生成的 HTML

<form action="/TestEdit" method="post">    
    <div style="clear:both; padding:1%;">       
        <div class="section">
            A
        </div>
        <div class="number">
            1
        </div>
        <div class="desc">
            First Row
        </div>
        <div class="ctrl">  

<select id="sectionRows_0__RowInput_0__InputtedData" name="sectionRows[0].RowInput[0].InputtedData"><option value="1">Yes</option>
<option value="0">No</option>
</select><input data-val="true" data-val-number="The field InputtedDataID must be a number." data-val-required="The InputtedDataID field is required." id="sectionRows_0__RowInput_0__InputtedDataID" name="sectionRows[0].RowInput[0].InputtedDataID" type="hidden" value="1" /><input data-val="true" data-val-number="The field CtrlTypeID must be a number." data-val-required="The CtrlTypeID field is required." id="sectionRows_0__RowInput_0__RowCtrl_CtrlTypeID" name="sectionRows[0].RowInput[0].RowCtrl.CtrlTypeID" type="hidden" value="1" />            <br /> 
    </div>
</form>

<form action="/TestEdit" method="post">    
    <div style="clear:both; padding:1%;">       
        <div class="section">
            A
        </div>
        <div class="number">
            2
        </div>
        <div class="desc">
            Second Row of Halls
        </div>
        <div class="ctrl">  

<select id="sectionRows_1__RowInput_0__InputtedData" name="sectionRows[1].RowInput[0].InputtedData"><option value="1">Accept</option>
<option value="0">Reject</option>
</select><input data-val="true" data-val-number="The field InputtedDataID must be a number." data-val-required="The InputtedDataID field is required." id="sectionRows_1__RowInput_0__InputtedDataID" name="sectionRows[1].RowInput[0].InputtedDataID" type="hidden" value="2" /><input data-val="true" data-val-number="The field CtrlTypeID must be a number." data-val-required="The CtrlTypeID field is required." id="sectionRows_1__RowInput_0__RowCtrl_CtrlTypeID" name="sectionRows[1].RowInput[0].RowCtrl.CtrlTypeID" type="hidden" value="2" />            <br /> 


<input id="sectionRows_1__RowInput_1__InputtedData" name="sectionRows[1].RowInput[1].InputtedData" type="text" value="UP, UP, DOWN, DOWN, LEFT, LEFT, RIGHT, RIGHT, B, A, B, A, START" /><input data-val="true" data-val-number="The field InputtedDataID must be a number." data-val-required="The InputtedDataID field is required." id="sectionRows_1__RowInput_1__InputtedDataID" name="sectionRows[1].RowInput[1].InputtedDataID" type="hidden" value="6" /><input data-val="true" data-val-number="The field CtrlTypeID must be a number." data-val-required="The CtrlTypeID field is required." id="sectionRows_1__RowInput_1__RowCtrl_CtrlTypeID" name="sectionRows[1].RowInput[1].RowCtrl.CtrlTypeID" type="hidden" value="6" />            <br /> 
    </div>
</form>

<form action="/TestEdit" method="post">    
    <div style="clear:both; padding:1%;">       
        <div class="section">
            A
        </div>
        <div class="number">
            3
        </div>
        <div class="desc">
            Third Row of fits and fixes and polishes
        </div>
        <div class="ctrl">  

<input id="sectionRows_2__RowInput_0__InputtedData" name="sectionRows[2].RowInput[0].InputtedData" type="text" value="50" /><input data-val="true" data-val-number="The field InputtedDataID must be a number." data-val-required="The InputtedDataID field is required." id="sectionRows_2__RowInput_0__InputtedDataID" name="sectionRows[2].RowInput[0].InputtedDataID" type="hidden" value="3" /><input data-val="true" data-val-number="The field CtrlTypeID must be a number." data-val-required="The CtrlTypeID field is required." id="sectionRows_2__RowInput_0__RowCtrl_CtrlTypeID" name="sectionRows[2].RowInput[0].RowCtrl.CtrlTypeID" type="hidden" value="3" />            <br /> 
    </div>
</form>

编辑：

我已经替换了以下 -

 <div class="ctrl">  
                @{
                    List<string> types = new List<string>() { "dropdown", "text", "radio", "checkbox" }             
                    @Html.EditorFor(y => y.RowInput.Where(z => types.Contains(z.RowCtrl.Type)), "CtrlInputDataModel")
                }
 </div>

与

 <div class="ctrl">  
            @{
                //List<string> types = new List<string>() { "dropdown", "text", "radio", "checkbox" };
                //var yy = Model.RowInput.Where(z => types.Contains(z.RowCtrl.Type));            
                @Html.EditorFor(y => y.RowInput)
            }
 </div>

和

@Html.EditorFor(x => x.sectionRows, "FormRowModel")

与

@Html.EditorFor(x => x.sectionRows)

仍然得到相同的结果。只有第一行回发数据。其他行返回 null。

【问题讨论】：

令人尴尬的新闻。我将文件夹命名为：DisplayTemplate 和 EditorTemplate。应该是：DisplayTemplates 和 EditorTemplates
现在我遇到的问题是它将回发第一行的数据。但其他人都没有。我觉得这与命名有关。我的模型有一个列表。该列表中还有另一个列表。
模型绑定在 for 循环中存在一些问题。建议用模板替换。
我确实用模板替换了它们。我已经发布了模板。您看到的 foreach 循环没有遍历模型。

标签： html asp.net-mvc asp.net-mvc-3 razor

【解决方案1】：

因此，在 Darin 的帮助下，我将部分视图转换为编辑器模板。在这种情况下，这是一件好事（TM）。但是，我只能将集合的第一行发回。经过一番谷歌搜索，我遇到了this page（各种stackoverflow问题也引用了它）。在实现了这段代码之后，没有任何东西被发回。然后我遇到了this post on StackOverflow。并看到我引用了错误的集合名称。我需要引用属性而不是模型名称。现在一切正常。

非常感谢 Darin 直接或间接地为我（和其他人）提供的所有帮助。谢谢！

对于任何难以让史蒂夫的代码工作的人，please look at this page。这是让自定义 htmlhelper 正常工作的整体解决方案。

【讨论】：