MVC 开始集合项
MVC BeginCollectionItem
我在将局部视图 BeginCollectionItem 保存到数据库时遇到了一些问题。我有一个可以添加到页面的动态编号为 "sections" 的表单,并且在每个字段中都有一个文本框,用户可以在其中输入部分名称。
据我所知,局部视图中的 BeginCollectionItem 工作正常,但我无法 post 将信息发送到数据库。在我的其他表格中,我使用 [bind()] 将数据发送到数据库,是否可以将其放入列表中,然后通过绑定 post ?
我在下面包含了我的代码:
模特:
namespace project.Models.SetupViewModels
{
public class SOPTopTemplateBuilderViewModel
{
public List<Section> Section { get; set; }
}
public class Section {
public int SectionId { get; set; }
public string SectionText { get; set; }
public string TopTempId { get; set; }
}
}
cshtml:
@model IEnumerable<project.Models.SetupViewModels.Section>
@using (Html.BeginForm("SOPTopTemplateBuilder", "Setup", FormMethod.Post))
{
<div class="main-holder" id="theform">
@foreach(var item in Model)
{
@Html.Partial("_SectionCreator", item)
}
</div>
<button id="add" type="button">Add</button>
<div class="form-group submit-row">
<div class="col-12 float-to-right">
<input type="submit" class="btn btn-default" value="continue" />
</div>
</div>
}
@section Scripts {
<script>
$(document).ready(function () {
var url = '@Url.Action("AddSection")';
var form = $('form');
var recipients = $('#theform');
$('#add').click(function() {
$.post(url, function(response) {
recipients.append(response);
// Reparse the validator for client side validation
form.data('validator', null);
$.validator.unobtrusive.parse(form);
});
});
});
</script>
}
局部视图:
@model project.Models.SetupViewModels.Section
@using HtmlHelpers.BeginCollectionItemCore
@using (Html.BeginCollectionItem("Section"))
{
<div class="new-section">
<div>
<p>New Section</p>
@Html.HiddenFor(m => m.SectionId, new { @class="id" })
@Html.EditorFor(m => m.SectionText, new { @class = "form-control limit-form"})
</div>
</div>
}
控制器:
[HttpPost]
public PartialViewResult AddSection()
{
return PartialView("_SectionCreator", new Section());
}
[HttpGet]
public ActionResult SOPTopTemplateBuilder(){
List<Section> model = new List<Section>();
return View(model);
}
[HttpPost]
public ActionResult SOPTopTemplateBuilder(IEnumerable<Section> soptop)
{
if (ModelState.IsValid)
{}
return View(soptop);
}
您对 Html.BeginCollectionItem("Section")
的使用将 Section[xxxx]
附加到名称属性(其中 xxxx
是 Guid
),以便您使用
生成输入
<input name="Section[xxxx].SectionId" .... />
回发到包含名为 Sections
.
的集合 属性 的模型
因为你已经有一个模型 属性,你可以将 POST 方法更改为
[HttpPost]
public ActionResult SOPTopTemplateBuilder(SOPTopTemplateBuilderViewModel soptop)
其他选项包括
- 使用现有的 POST 方法并省略 "Section" 前缀
使用
Html.BeginCollectionItem("")
将生成
name="[xxxx].SectionId"
- 将 POST 方法签名更改为
public ActionResult
SOPTopTemplateBuilder(IEnumerable<Section> section)
(其中
参数名称匹配前缀名称)
- 使用
BindAttribute
到 'strip' 表单值的前缀
public ActionResult SOPTopTemplateBuilder([Bind(Prefix = "Section")]IEnumerable<Section> soptop)
作为旁注,您的编辑数据,因此您应该始终使用视图模型(比如 public class SectionViewModel
),而不是在视图中使用数据模型。 - What is ViewModel in MVC?
我在将局部视图 BeginCollectionItem 保存到数据库时遇到了一些问题。我有一个可以添加到页面的动态编号为 "sections" 的表单,并且在每个字段中都有一个文本框,用户可以在其中输入部分名称。
据我所知,局部视图中的 BeginCollectionItem 工作正常,但我无法 post 将信息发送到数据库。在我的其他表格中,我使用 [bind()] 将数据发送到数据库,是否可以将其放入列表中,然后通过绑定 post ?
我在下面包含了我的代码: 模特:
namespace project.Models.SetupViewModels
{
public class SOPTopTemplateBuilderViewModel
{
public List<Section> Section { get; set; }
}
public class Section {
public int SectionId { get; set; }
public string SectionText { get; set; }
public string TopTempId { get; set; }
}
}
cshtml:
@model IEnumerable<project.Models.SetupViewModels.Section>
@using (Html.BeginForm("SOPTopTemplateBuilder", "Setup", FormMethod.Post))
{
<div class="main-holder" id="theform">
@foreach(var item in Model)
{
@Html.Partial("_SectionCreator", item)
}
</div>
<button id="add" type="button">Add</button>
<div class="form-group submit-row">
<div class="col-12 float-to-right">
<input type="submit" class="btn btn-default" value="continue" />
</div>
</div>
}
@section Scripts {
<script>
$(document).ready(function () {
var url = '@Url.Action("AddSection")';
var form = $('form');
var recipients = $('#theform');
$('#add').click(function() {
$.post(url, function(response) {
recipients.append(response);
// Reparse the validator for client side validation
form.data('validator', null);
$.validator.unobtrusive.parse(form);
});
});
});
</script>
}
局部视图:
@model project.Models.SetupViewModels.Section
@using HtmlHelpers.BeginCollectionItemCore
@using (Html.BeginCollectionItem("Section"))
{
<div class="new-section">
<div>
<p>New Section</p>
@Html.HiddenFor(m => m.SectionId, new { @class="id" })
@Html.EditorFor(m => m.SectionText, new { @class = "form-control limit-form"})
</div>
</div>
}
控制器:
[HttpPost]
public PartialViewResult AddSection()
{
return PartialView("_SectionCreator", new Section());
}
[HttpGet]
public ActionResult SOPTopTemplateBuilder(){
List<Section> model = new List<Section>();
return View(model);
}
[HttpPost]
public ActionResult SOPTopTemplateBuilder(IEnumerable<Section> soptop)
{
if (ModelState.IsValid)
{}
return View(soptop);
}
您对 Html.BeginCollectionItem("Section")
的使用将 Section[xxxx]
附加到名称属性(其中 xxxx
是 Guid
),以便您使用
<input name="Section[xxxx].SectionId" .... />
回发到包含名为 Sections
.
因为你已经有一个模型 属性,你可以将 POST 方法更改为
[HttpPost]
public ActionResult SOPTopTemplateBuilder(SOPTopTemplateBuilderViewModel soptop)
其他选项包括
- 使用现有的 POST 方法并省略 "Section" 前缀
使用
Html.BeginCollectionItem("")
将生成name="[xxxx].SectionId"
- 将 POST 方法签名更改为
public ActionResult SOPTopTemplateBuilder(IEnumerable<Section> section)
(其中 参数名称匹配前缀名称) - 使用
BindAttribute
到 'strip' 表单值的前缀public ActionResult SOPTopTemplateBuilder([Bind(Prefix = "Section")]IEnumerable<Section> soptop)
作为旁注,您的编辑数据,因此您应该始终使用视图模型(比如 public class SectionViewModel
),而不是在视图中使用数据模型。 - What is ViewModel in MVC?