如何在 MVC 中绑定 List<SimpleObject> [重复]答案

【问题标题】：How to bind List<SimpleObject> in MVC [duplicate]如何在 MVC 中绑定 List<SimpleObject> [重复]
【发布时间】：2017-02-10 20:20:26
【问题描述】：

这是我的场景：

public class ComplexObject
{
   public int SomeProperty {get;set;}
   public List<SimpleObject> Object {get;set;}
}

public class SimpleObject
{
public string FirstName {get;set;}
public string LastName {get;set;}

}

我为SimpleObject创建了一个强类型的局部视图

@model SimpleObject
    <div>
        <input type="button" value="Button" name="btn" />
        <div>
            <div>
                @Html.TextBoxFor(Model => Model.FirstName, new { @class = "", @maxlength = "50" })
            </div>
            <div>
                @Html.TextBoxFor(Model => Model.LastName, new { @class = "", @maxlength = "50" })
            </div>

现在我想在另一个视图 (MainView) 中渲染这个局部视图。这个想法是用户可以单击 SimpleObject 部分视图按钮并在 MainView 上再次生成相同的局部视图。所以这是它的外观：

MainView
    SimpleView -> Add
        SimpleView -> Add

我可以创建一个 ajax 操作并生成简单视图并将其附加到主视图，但问题是 simpleobject 没有绑定到 ComplexObject。

这就是我在 MainView 中渲染局部视图的方式。

 @Html.Partial("_PartialView", Model.SimpleObject, new ViewDataDictionary(ViewData)
{
    TemplateInfo = new System.Web.Mvc.TemplateInfo
    {
        HtmlFieldPrefix = "Simple"
    }
})

MainView 在提交单击时调用控制器操作，并提交整个ComplexObject。这里我的SimpleObject 列表始终为 NULL。

 public ActionResult CreateComplex(ComplexObject object)
 {
     // HERE LIST<SIMPLEOBJECT> is always NULL 
 }

任何想法我在这里做错了什么？

【问题讨论】：

A partial 本身不起作用，因为您没有将索引器添加到 name 属性。一些选项请参考this answer

标签： asp.net asp.net-mvc asp.net-mvc-4 asp.net-mvc-5

【解决方案1】：

第一次渲染局部视图时，您将看到如下内容：

<div>
       <input type="text" name="FirstName" maxlength="50" />
</div>   
<div>
       <input type="text" name="LasttName" maxlength="50" />
</div>

当您向页面添加多个部分视图时，最后只有 2 个文本框将发布到服务器，因为它们都具有相同的名称。

要解决此问题，您必须更改局部视图以使输入框像数组一样，您可以向模型添加属性并从操作中设置它假设您在模型中添加了一个名为 Index 的属性，您的代码应该如下所示

@model SimpleObject
    <div>
        <input type="button" value="Button" name="btn" />
        <div>
            <div>
                @Html.TextBox("FirstName["+Model.Index+"]", new { @class = "", @maxlength = "50" })
            </div>
            <div>
               @Html.TextBox("LastName["+Model.Index+"]", new { @class = "", @maxlength = "50" })
            </div>

每次提交按钮时，您都会增加索引并呈现视图。

另一种解决方法，就是去掉部分视图，用JavaScript添加输入框，可以使用Knockout

看看这篇解释如何做的文章：http://knockoutjs.com/examples/grid.html

【讨论】：

【解决方案2】：

以下是我对原始问题中发布的代码所做的更改，以将 SimpleObjects 列表绑定到 ComplexObject。

@Html.Partial("_PartialView")

这个类看起来像这样：

public class ComplexObject
{
   public int SomeProperty {get;set;}
   public List<SimpleObject> Objects {get;set;}
}

部分视图以 BeginCollectionItem 开头

@model AZSolutions.Framework.Model.SimpleObject
@using (Html.BeginCollectionItem("Objects")) { 
...
}

【讨论】：