在Asp.net mvc剃刀视图中添加和删除动态表中的行



我是asp.net mvc的新手。在我的项目中,我必须添加一个表,用户可以在其中输入详细信息并从下拉列表中选择选项。当用户单击添加按钮时,必须将一行添加到包含所有字段(包括文本框、下拉列表)的表中。此外,当用户单击删除按钮时,必须从表中删除该特定行。默认情况下,当页面加载时,我应该在表中有两行,其中包含所有必需的字段。我需要解决以下问题

  1. 如何完成上述任务
  2. 我还需要保存表格的详细信息。那么,如何将表的详细信息传递给控制器呢
  3. 保存完详细信息后,当用户单击编辑按钮时,我应该加载表中的所有详细信息。请帮帮我

我也搜索了很多,但没有一个例子在动态表中包含下拉选项。请帮我完成这项任务。提前感谢所有的志愿者。

我建议使用Steve Sanderson创建的BeginCollectionItem()帮助程序

http://blog.stevensanderson.com/2010/01/28/editing-a-variable-length-list-aspnet-mvc-2-style/

它完全实现了你想要的,他用一个工作例子一步一步地介绍它。我已经在我的几个项目中使用过它。

我本来会在评论中留下一些链接,但我还没有足够的rep。因此,我将把这作为一个答案放在这里,并对其进行比我在评论中更多的阐述。但这只是一般信息。请提供更多详细信息以获得更具体的答案。

首先,您使用的MVC版本是什么?您的数据模型是什么样子的?您正在使用EntityModel吗?您是否考虑过客户端MVC或MVVM框架或库,如AngularJS或Knockout?

根据您对这些问题的回答,您的问题的答案可能是…

  1. 为数据模型创建一个类,并开始使用数据注释对其进行装饰。要显示在表中的每一列都应作为公共属性公开。这可以推动代码优先的DB方法。或者,您可以从现有数据库构建EntityModel。如果要这样做,您可能需要查看EF向导使用的T4模板的修改,以便将数据注释添加到生成的实体模型中
  2. 您可以使用开箱即用的脚手架为CRUD操作生成剃刀模板。然后,您可以使用新的T4技能来修改脚手架模板
  3. 考虑将WebAPI和/或SignalR与客户端框架一起使用,以提供RESTful api或持久连接,其中任何一种都可以用于在客户端和服务器之间同步应用程序级数据

这可能看起来是一个不错的开销,但1&如果你想最大限度地利用Razor视图,2可以为你节省很多时间。

不过,您可能希望在大多数时间只与客户端交换应用程序级别的数据。您可以使用AngularJS等框架构建客户端架构,也可以围绕Knockout等库构建自己的框架,以绑定到您的数据,并允许标记(例如AngularJS中的自定义指令模板)通过客户端控制器实际生成和呈现。

对于一个开源的、标准化的外观和感觉,我建议研究Boostrap,以获得一组相对易于使用的组件和布局/样式约定。您可以直接使用它,也可以将它与其他js-lib结合使用,比如这样。

最新更新