0

EditorTemplates を使用するようにページを書き直しました。そして、彼らはとてもいいです。ただし、ポストバックすると、最初の行のみがデータをポストバックします。他の 4 行は null として表示されます。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 に戻ります。

4

1 に答える 1

1

そこで、Darin の助けを借りて、部分ビューをエディター テンプレートに変換しました。この場合、これは Good Thing (TM) です。ただし、投稿されたコレクションの最初の行しか取得できませんでした。グーグルで調べた後、このページに出くわしました（これは、さまざまなスタックオーバーフローの質問でも参照されています）。このコードを実装した後、何も投稿されませんでした。次に、 StackOverflow に関するこの投稿に出くわしました。そして、コレクションの間違った名前を参照していることに気付きました。モデル名ではなく、プロパティを参照する必要がありました。現在、すべてが正常に機能しています。

Darin が私 (および他の人) に提供してくれた直接的および間接的なすべての支援に大いに感謝します。ありがとう！

スティーブのコードを動作させるのに少し問題がある人は、このページを見てください。これは、カスタム htmlhelpers を一般的に機能させるための全体的なソリューションです。

于 2012-07-09T15:22:49.653 に答える