如何使用编组列表中的已编辑项目发布模型？

Question

我有以下问题。我需要在分组列表中编辑项目值，并将模型发布到服务器。

我的模型和视图模型：

public class MyObject 
{ 
    public string ParentName { get; set; } 
    public string SubParentName { get; set; } 
    public string ItemName { get; set; } 
    public decimal Value { get; set; } 
} 

public class MyViewModel 
{ 
    public IList<MyObject> list; 
} 

而且简化（不分组的项目中的HTML表格组）实现的观点：

@model MyViewModel 

@(using (Html.BeginForm("Action", "Controller", FormMethod.Post))) 
{ 
    <table> 
     <tbody> 
      @foreach(var parentItems in Model.list.GroupBy(x => x.ParentName)) 
      { 
       foreach(var subParents in parentItem.GroupBy(x => x.SubItemName)) 
       { 
        foreach (var item in subParents) 
        { 
         <tr> 
          <td><parentItems.FirstOrDefault().ParentName</td> 
          <td><subParents.FirstOrDefault().SubParentName</td> 
          <td>item.ItemName</td> 
          <td><input class="itemValue">**Editable value item.Value**</td> 
         </tr> 
        } 
       } 
      } 
     </tbody> 
    </table> 

    <button type="submit">Save</button> 
} 

怎么办呢？

解决

@model MyViewModel 

@(using (Html.BeginForm("Action", "Controller", FormMethod.Post))) 
{ 
    <table> 
     <tbody> 
      @foreach(var parentItems in Model.list.GroupBy(x => x.ParentName)) 
      { 
       @{ var counter = 0;} 
       foreach(var subParents in parentItem.GroupBy(x => x.SubItemName).Select(x => x.ToList())) 
       { 
        for(int i = 0; i < subParents.Count(); i++, counter++) 
        { 
         <tr> 
          <td> 
           @Html.DisplayFor(x => x.list[counter].ItemName) 
           @Html.HiddenFor(x => x.list[counter].ItemName) 

          </td> 
          <td> 
           @Html.TextBoxFor(x => x.list[counter].Value, new { myAttr = "myAttrValue"}); 
          </td>       
         </tr> 

         @Html.HiddenFor(x => x.Reports[counter].ParentName) 
         @Html.HiddenFor(x => x.Reports[counter].SubParentName) 
        } 
       } 
      } 
     </tbody> 
    </table> 

    <button type="submit">Save</button> 
} 

感谢大家的帮助:)

Answer 1

有趣的问题。使用foreach循环不会工作，因为控件将没有正确的索引name属性用于回发，并且单个for循环不会允许您的分组，除非包括条件检查（例如，测试ParentName和SubParentName已从先前呈现的项目更改并且然后渲染一个新的组标题或启动一个新表或其他）。

我建议你创建一个视图模型，以更好地代表层次结构和填充视图模型控制器

public class MyObject 
{ 
    public string ParentName { get; set; } 
    public string SubParentName { get; set; } 
    public string ItemName { get; set; } 
    public decimal Value { get; set; } 
} 

public class SubParentVM 
{ 
    public string Name { get; set; } // assuming you want some kind of group heading 
    public List<MyObject> Items { get; set; } 
} 

public class ParentVM 
{ 
    public string Name { get; set; } 
    public List<SubParentVM> Items { get; set; } 
} 

和视图

@model List<ParentVM> 

for (int i = 0; i < Model.Count; i++) 
{ 
    .... 
    for (int j = 0; j < Model[i].Items.Count; i++) 
    { 
    .... 
    for (int k = 0; k < Model[i].Items[j].Count; i++) 
    { 
     <tr> 
     <td>Model[i].Items[j].Items[k].ParentName</td> 
     <td>Model[i].Items[j].Items[k].SubParentName</td> 
     <td>Model[i].Items[j].Items[k].ItemName</td> 
     <td> 
      <@Html.TextBoxFor(m => m.[i].Items[j].Items[k].Value) 
      // Assuming you want other properties of MyObject to post back 
      <@Html.HiddenFor(m => m.[i].Items[j].Items[k].ItemName) 
      <@Html.HiddenFor(m => m.[i].Items[j].Items[k].SubParentName) 
      <@Html.HiddenFor(m => m.[i].Items[j].Items[k].ParentName) 
     </td> 
     </tr> 
    } 
    } 
} 

控制器上

[HttpPost] 
public ActionResult Save(List<ParentVM> items) 
{ 
    .... 

Answer 2

控制器代码：

[HttpPost] 
public ActionResult Action([FromBody] values) 
{ 
} 

您的视图代码：

@(using (Html.BeginForm("Action", "Controller", FormMethod.Post))) 
{ 
    <table> 
     <tbody> 
      @for(int i =0; i< Model.Count; i++) 
      { 
       <tr> 
        <td> 
          @Html.DisplayFor(x=> x.ParentName) 
          @Html.HiddenFor(x=> x.ParentName) 
        </td> 
        <!-- same to all not editable fields --> 
        <td>@Html.TextBoxFor(x=> x.Value)</td> 
       </tr> 
      } 
     </tbody> 
    </table> 

    <button type="submit">Save</button> 
}