模型绑定到列表

时间:2011-07-09 15:10:48

标签: .net vb.net asp.net-mvc-3 razor model-binding

如何设置默认的模型绑定句柄列表?

假设我有一个ShoppingCart类,它有一个ShoppingCartItem List:

Public Class ShoppingCart
  Public Property CouponCode As String
  Public Property Items As New List(Of ShoppingCartItem)
End Class

Public Class ShoppingCartItem
  Public Property Title As String
  Public Property Count As Integer
End Class

我的观点如下(根据this的建议和this,博客):

@ModelType VAVTag.LuckyDraw.ShoppingCart

@Code
  Layout = Nothing
End Code
<!DOCTYPE html>
<html>
<head runat="server">
  <title>Index</title>
</head>
<body>
  @Using Html.BeginForm()
    @<fieldset>
      <legend>ShoppingCart</legend>
      @Html.TextBoxFor(Function(m) m.CouponCode)
      <hr />
      @Html.EditorFor(Function(m) m.Items)

      <p>
        <input type="submit" value="Save" />
      </p>
    </fieldset>
  End Using
</body>
</html>

使用EditorTemplate呈现项目(感谢Darin):

@ModelType ShoppingCartItem
@Html.EditorFor(Function(m) m.Title )
@Html.EditorFor(Function(m) m.Count )
<br />

在我的控制器中,我正在插入一些随机数据,并且视图很好地呈现了我的购物车,有三个项目。

Public Class ShoppingCartController
  Inherits System.Web.Mvc.Controller

  Function Index() As ActionResult
    Dim model As New ShoppingCart
    model.Items.Add(New ShoppingCartItem With {.Count = 1, .Title = "Item A"})
    model.Items.Add(New ShoppingCartItem With {.Count = 17, .Title = "Item B"})
    model.Items.Add(New ShoppingCartItem With {.Count = 100, .Title = "Item C"})

    Return View(model)
  End Function

  <HttpPost()>
  Function Index(model As ShoppingCart) As ActionResult
    Return View(model) ' model is empty!
  End Function
End Class

然而,当我提交页面时,没有选择任何值,甚至没有提取CouponCode字段。模型对象为空。是什么给了什么?

最终,我的目标是通过javascript添加/删除客户端项目,然后让模型绑定器在提交页面时自动选择更改。

更新:我刚从模型属性声明中遗漏了Property关键字。已经太晚了,我得睡一会儿。 :)

1 个答案:

答案 0 :(得分:2)

  

如何设置默认的模型绑定句柄列表?

默认模型绑定器already handles lists and dictionaries非常好。

只需使用编辑器模板。例如:

查看型号:

public class ShoppingCartItem
{
    public string Title { get; set; }
    public int Count { get; set; }
}

public class ShoppingCart
{
    public string CouponCode { get; set; }
    public List<ShoppingCartItem> Items { get; set; }
}

控制器:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        var model = new ShoppingCart
        {
            Items = new[]
            {
                new ShoppingCartItem { Count = 1, Title = "Item A" },
                new ShoppingCartItem { Count = 17, Title = "Item B" },
                new ShoppingCartItem { Count = 100, Title = "Item C" },
            }.ToList()
        };
        return View(model);
    }

    [HttpPost]
    public ActionResult Index(ShoppingCart model)
    {
        return View(model);
    }
}

查看:

@model ShoppingCart
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <title>Index</title>
</head>
<body>
    @using (Html.BeginForm())
    {
        <fieldset>           
            <legend>ShoppingCart</legend>
            @Html.TextBoxFor(x => x.CouponCode)
            <hr/>
            @Html.EditorFor(x => x.Items)
        </fieldset>
        <p>
            <input type="submit" value="Save" />
        </p>
    }
</body>
</html>

最后是将为~/Views/Home/EditorTemplates/ShoppingCartItem.cshtml集合的每个项目呈现的编辑器模板(Items):

@model ShoppingCartItem
@Html.EditorFor(x => x.Title)
@Html.EditorFor(x => x.Count)