如何从ASP.NET MVC视图中动态添加和删除行项目？

Question

我有一个PurchaseOrder模型：

public class PurchaseOrder
{ 
    public string OrderNumber { get; set; }
    public string Customer { get; set; }
    public IList<LineItem> Lines { get; set; }
}

和一个LineItem类：

public class LineItem
{ 
   public string PartNumber { get; set; }
   public int Quantity { get; set; }
}

我想要做的是在我对PurhcaseOrder Create操作的看法，我需要一个关于订单项的部分。用户应该能够添加新行，删除一行，然后提交。需要注意的是，PartNumber需要是有效部件的下拉列表。

我能做些什么来完成我正在寻找的东西？

Answer 1

http://knockoutjs.com/对此很不错。

http://knockoutjs.com/examples/cartEditor.html显示了一个编辑器，可以添加/删除行并包含下拉列表。

并且有一篇古老的文章讨论了如何将Knockoutjs与asp.net mvc一起使用 - http://blog.stevensanderson.com/2010/07/12/editing-a-variable-length-list-knockout-style/

Answer 2

如果您想在没有js的情况下执行所有操作，请创建一个新操作/视图以添加和编辑订单项。对于删除，使用actionlink删除项目是不好的做法，GET应该永远不会改变数据。因此，一个好的模式是将删除链接转到确认页面。然后从该页面POST到删除操作（或取消并返回）

Answer 3

我将使用jQuery（在客户端）创建此功能

---

零件号1345 - 124件[取消]
零件号1489 - 101件[删除]

[选择部分namber /] [_数量_] [添加]

---

另外，对于已禁用JS的客户端，您可以使用服务器端代码复制此功能（完全相同的UI）。为此，您可以将Temprorary LineItem存储在TempData中（当用户单击“添加行项目”时，在每个帖子上）。