在使用MVC核心实现BeginCollectionItem时,我似乎没有遇到与大多数人相同的问题,我没有收到任何数据。
我有一个主页面,它有很多工作要做,但这里是向页面添加新部分的javascript,以及将在下面添加的部分。
@model QuizBuilderModel
...
function addSection() {
$.ajax({
url: '@Url.Action("AddSection","Quiz")',
cache: false,
success: function (html) {
$("#sortable-survey").append(html);
}
});
}
...
<div class="quiz-builder" id="quiz-builder" style="@((Model.Quiz == null || string.IsNullOrEmpty(Model.Quiz.Id))? "display: none;" : "")">
@{await Html.RenderPartialAsync("~/Views/Admin/Quiz/_QuizBuilder.cshtml", Model);}
</div>
现在,我们有这个部分来开始我们正在构建的表单。
@model QuizBuilderModel
<div id="sortable-survey" class="sortable-survey">
@using (Html.BeginForm("PostQuizUpdate", "Quiz", FormMethod.Post))
{
@if (Model.Quiz != null && !string.IsNullOrEmpty(Model.Quiz.Id))
{
<input type="submit" class="btn btn-lg btn-outline-primary top-right-button top-right-button-single" id="SaveQuizModal" name="SaveQuizModal" value="Save Quiz" />
}
@if (Model.Quiz != null && Model.Quiz.Sections != null)
{
foreach (Sections section in Model.Quiz.Sections)
{
await Html.RenderPartialAsync("~/Views/Admin/Quiz/_Section.cshtml", Model);
}
}
}
</div>
<div>
<div class="text-center">
<button type="button" class="btn btn-outline-primary btn-sm my-5" id="AddSection" onclick="addSection();">
<i class="simple-icon-plus btn-group-icon"></i>
Add Section
</button>
</div>
</div>
然后我有一个部分,我们将在其中添加越来越多的内容。
@using HtmlHelpers.BeginCollectionItemCore
@model Sections
@using (Html.BeginCollectionItem("Sections"))
{
<div class="form-group">
@Html.LabelFor(x => x.Title);
@Html.EditorFor(m => m.Title, new { @class = "form-control" })
</div>
<div class="form-group">
<label>SubTitle (optional)</label>
@Html.EditorFor(m => m.SubTitle, new { @class = "form-control" })
</div>
<div class="form-group">
<label>Instructions (optional)</label>
<textarea type="text" class="form-control" placeholder="" id="Instructions" name="Instructions" required rows="10" cols="50"></textarea>
</div>
}
帖子的回复发送到这里。。。
[HttpPost]
public async Task<IActionResult> PostQuizUpdate(IEnumerable<Sections> Sections)
{
...
}
就像我之前说的,当我点击提交时,我没有得到帖子中的章节列表。
您的脚本正在将包含BeginCollectionItem
的分部追加到<div id="sortable-survey" class="sortable-survey">
元素中。但该元素包含您的<form>....</form>
元素,因此$("#sortable-survey").append(html);
将在关闭的</form>
标记之后附加html,因此,<form>
本身将不包含任何表单控件,因此无需提交任何内容。
更改html,使<div>
位于<form>
元素内
@using (Html.BeginForm("PostQuizUpdate", "Quiz", FormMethod.Post))
{
<div id="sortable-survey" class="sortable-survey">
....
</div>
}
使得附加的表单控件在表单标签内。
附带说明一下,如果Sections
属性包含任何现有元素,那么await Html.RenderPartialAsync("~/Views/Admin/Quiz/_Section.cshtml", Model);
将抛出传递到字典中的模型项的类型为。。但是这个字典需要一个exception类型的模型项。您需要将foreach
循环修改为
foreach (Sections section in Model.Quiz.Sections)
{
await Html.RenderPartialAsync("~/Views/Admin/Quiz/_Section.cshtml", section); // section, not Model
}
此外,我建议您在将模型传递到视图之前在控制器中初始化集合,以便删除视图中的if null
检查。