asp.net razor表单提交中的模型绑定动态列表

Question

我正在尝试创建输入订单。

我需要用户能够添加多个订单项然后更新。我想要 使用购物车类（用户创建购物车项目并添加一个  列表项，可以将多行添加到列表项中）。

我没有完全接受。我正在使用asp.net razor  webmatrix建立网站。 Webmatrix说它不识别Cart（）。

@{ 
if (Session["cart"] == null)
{
Session["cart"] = new Cart();
}
Cart cart = (Cart)Session["cart"];

}
<table id="cartTable">
<tr>
<th class="product">Product</th>
<th class="size">Size</th>
<th class="price">Price</th>
</tr>
@foreach (var item in cart.Items)
{
<tr>
<td class="product">@item.ProductID</td>
<td class="size">@item.Size</td>
<td class="price">£@item.Price</td>
</tr>
}
</table>

有更好的方法吗？非常感谢所有帮助

Answer 1

有一种绑定动态列表元素的方法

@foreach (i=0; i< cart.Items.count; i++)
{
<tr>
   <td class="product"> <input type="hidden" name="cart.item[@i].ProductID"> </td>
   <td class="size"> <input type="text" name="cart.item[@i].Size"> </td>
   <td class="price">£ <input type="text" name="cart.item[@i].Price"> </td>
</tr>
}

---

Webmatrix is saying that it doesnt recognise Cart()

我强烈建议您将模型放在Models文件夹中，并使它们成为Models名称空间的一部分。然后它们应该自动可用。否则，您可能必须通过它的完整参考路径引用购物车（如果它不在您的Models文件夹中）。示例

Datalayer.Entities.Cart cart = (Datalayer.Entities.Cart)Session["cart"];

---

最后注意事项： 您没有将购物车作为模型传递给您的视图

例如

@model {Project}.Entities.Cart

使用MVC 3框架是一种更好的做法。您之前会发现任何引用问题，并且可以选择使用紧密绑定的Helpers

Answer 2

我建议使用Visual Studio 2012 Express而不是WebMatrix进行MVC开发。此外，如果您希望让用户通过同一页面动态添加订单项，我还建议您使用jQuery（javascript）。如果你愿意，我可以和你分享一个例子。

还有一点需要注意：你用MVC和WebForms标记了这两个版本，它们是两个非常不同的平台。

修改

我认为Dave A的解决方案可能会更好，但是要用jQuery做到这一点：

1将您的添加按钮和隐藏的div放在表单

中

<form action="/MyController/MyAction" method="post" id="addListItemForm">
<button id="addListItemButton">Add List Item</button>
<div style="hidden">
<input type="text" name="product" id="product" />
<button id="addButton">Add</button>
</div>
<input type="submit" text="Submit" />
</form>

2在按钮上单击

显示表单字段

$('#addListItemButton').click(function(){
  $('#addListItemForm div').show();
});

3在添加按钮上添加隐藏字段单击

$('#addButton').click(function(){
  var product = $('#addListItemForm #product').val();
  $("input").attr({
            name : "productListItems[]", 
            type : "hidden",
            value : product
        }).after('#addListItemForm');
});

4表单提交时，您将通过POST方法传递productListItems数组中的各种产品名称。

注意：你必须稍微玩这个，但这将是一个很好的学习练习...我不确定你想做什么，但这是我最好的猜测。