首页 > web前端 > js教程 > 如何使用 Html.BeginCollectionItem 将动态添加的字段正确绑定到模型?

如何使用 Html.BeginCollectionItem 将动态添加的字段正确绑定到模型?

Barbara Streisand
发布: 2024-12-05 16:13:11
原创
617 人浏览过

How to Properly Bind Dynamically Added Fields to a Model Using Html.BeginCollectionItem?

使用 Html.BeginCollectionItem 帮助器传递集合的部分视图

问题

在使用 Html.BeginCollectionItem 帮助器的项目中,由 JavaScript 生成的新字段是在表单提交期间不绑定到模型。此外,BeginCollectionItem 帮助程序没有为新字段呈现隐藏标签。

解决方案

1。创建视图模型:

定义一个视图模型(例如,CashRecipientVM)来表示要编辑的数据,并带有适当的数据注释。

2.创建部分视图:

使用 BeginCollectionItem 帮助器创建部分视图 (_Recipient.cshtml),包括必要的标签、文本框和删除按钮。

3 。实现返回部分视图的方法:

在控制器中实现返回部分视图的方法(例如 Recipient())。

4.更新 GET 方法:

在主视图的 GET 方法中,创建视图模型的初始列表。

5.更新主视图:

在主视图中,使用 foreach 循环显示现有对象并使用 BeginCollectionItem 帮助器添加部分视图。

6.实现用于添加项目的 JavaScript:

编写 JavaScript,在单击按钮时将新视图模型的 HTML 添加到表单。

7.实现用于删除项目的 JavaScript:

编写 JavaScript 以在单击删除按钮时删除项目,并向服务器发出适当的 AJAX 请求。

8.更新 POST 方法:

更新表单以回发到接收视图模型集合的方法(例如,Create(IEnumerablerecipients))。

附加说明:

  • 确保添加项目的脚本使用正确的收件人方法 URL。
  • 使用数据注释来验证客户端的数据。
  • 要提高性能,请考虑使用 knockout.js 或 MVVM框架而不是 JavaScript 进行数据绑定。

以上是如何使用 Html.BeginCollectionItem 将动态添加的字段正确绑定到模型?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板