当我获取具有相同模型的视图时,它包含 2 个问题,每个问题有 2 个答案选项。到目前为止一切顺利。
问题是,无论我选择什么答案选项,当我发布表单时,我总是会得到零个问题,尽管当我检查生成的 HTML 时我的索引看起来正确,文本被正确呈现,因此循环和索引应该可以工作。我已经在输入上使用 asp-for 来绑定属性。为什么我没有得到任何问题?
我搜索过类似的帖子,但我就是看不出我做错了什么,所以我一定漏掉了什么。请帮忙!
这是重现该问题的视图:
@model JobMediation.Api.Models.Onboarding.ViewModels.StartOnboardingOnlineTestModel
@{
ViewData["Title"] = "Online-test!";
Layout = "~/Views/Shared/_Layout.cshtml";
}
@using (Html.BeginForm("StartOnboardingOnlineTest", "Onboarding", Model, FormMethod.Post))
{
<div>
@for (var i = 0; i < Model.OnboardingTestQuestions.Count; i++)
{
<p>
@(i + 1). @Model.OnboardingTestQuestions[i].QuestionText
</p>
@for (var j = 0; j < Model.OnboardingTestQuestions[i].OnboardingTestAnswerOptions.Count; j++)
{
<div>
<input type="radio" asp-for="@Model.OnboardingTestQuestions[i].SelectedAnswerOptionId" value="@Model.OnboardingTestQuestions[i].OnboardingTestAnswerOptions[j].AnswerOptionId">
<label><p>@(j + 1). @Model.OnboardingTestQuestions[i].OnboardingTestAnswerOptions[j].Text</p></label>
</div>
}
<div style="display:none">
questionId: <input hidden asp-for="@Model.OnboardingTestQuestions[i].QuestionId" type="text" required>
questionText: <input hidden asp-for="@Model.OnboardingTestQuestions[i].QuestionText" type="text" required>
</div>
}
<button>Send</button>
</div>
}
我的视图模型:
using System.Collections.Generic;
namespace JobMediation.Api.Models.Onboarding.ViewModels
{
public class StartOnboardingOnlineTestModel
{
public List<OnboardingTestQuestion> OnboardingTestQuestions { get; set; } = new List<OnboardingTestQuestion>();
}
}
using System.Collections.Generic;
namespace JobMediation.Api.Models.Onboarding.ViewModels
{
public class OnboardingTestQuestion
{
public string QuestionId{ get; set; }
public string QuestionText { get; set; }
public List<OnboardingTestAnswerOption> OnboardingTestAnswerOptions { get; set; } = new List<OnboardingTestAnswerOption>();
public string SelectedAnswerOptionId { get; set; }
}
}
namespace JobMediation.Api.Models.Onboarding.ViewModels
{
public class OnboardingTestAnswerOption
{
public string AnswerOptionId { get; set; }
public string Text { get; set; }
}
}
我的控制器:
[HttpGet]
[Route("/route")]
[CanBeLoggedInAttribute]
public async Task<IActionResult> StartOnboardingOnlineTest()
{
var model = new StartOnboardingOnlineTestModel
{
OnboardingTestQuestions = new List<OnboardingTestQuestion> {
new Models.Onboarding.ViewModels.OnboardingTestQuestion
{
QuestionId = Guid.NewGuid().ToString(),
QuestionText = "Question 1",
OnboardingTestAnswerOptions = new List<OnboardingTestAnswerOption>
{
new Models.Onboarding.ViewModels.OnboardingTestAnswerOption
{
AnswerOptionId = Guid.NewGuid().ToString(),
Text = "Option 1"
},
new Models.Onboarding.ViewModels.OnboardingTestAnswerOption
{
AnswerOptionId = Guid.NewGuid().ToString(),
Text = "Option 2"
}
},
SelectedAnswerOptionId = Guid.Empty.ToString()
},
new Models.Onboarding.ViewModels.OnboardingTestQuestion
{
QuestionId = Guid.NewGuid().ToString(),
QuestionText = "Question 2",
OnboardingTestAnswerOptions = new List<OnboardingTestAnswerOption>
{
new Models.Onboarding.ViewModels.OnboardingTestAnswerOption
{
AnswerOptionId = Guid.NewGuid().ToString(),
Text = "Option A"
},
new Models.Onboarding.ViewModels.OnboardingTestAnswerOption
{
AnswerOptionId = Guid.NewGuid().ToString(),
Text = "Option B"
}
},
SelectedAnswerOptionId = Guid.Empty.ToString()
}
}
};
return View("TEMP", model);
}
[HttpPost]
[Route("/route")]
public async Task<IActionResult> StartOnboardingOnlineTest(StartOnboardingOnlineTestModel model)
{
// Handle the returned questions, but when debugging the model-parameter returns an empty list as model.OnboardingTestQuestions, see picture below
}
从调试中返回的 OnboardingTestQuestions 空列表的图片:
我曾在 Google 上搜索过类似的帖子,但据我所知,我已经按照它们实施了。我使用 for 循环而不是 foreach,索引看起来正确,我使用 asp-for 和 HTML 输入来获取返回数据,但没有成功。
例如,我查看了这篇文章,为什么使用 foreach 循环在 Razor 页面上显示值时,绑定的 List<T> 返回空?,以及许多其他文章,我认为我已经做了同样的事情,但我的代码仍然不起作用。我也尝试过在 OnboardingTestQuestions 列表上使用和不使用 [BindProperty] 以及在 StartOnboardingOnlineTestModel 类上使用和不使用 [BindProperties],没有任何区别。我也尝试过在 OnboardingTestQuestions 列表和 OnboardingTestAnswerOption. 列表中使用和不使用列表实例,结果也相同。
GET 运行完美。视图看起来与预期一致。问题和答案选项的索引在视图中显示时有效,我还通过右键单击并选择检查来检查生成的 HTML - 但显然有些东西仍然不起作用。以下是生成的表单 HTML:
<form action="/soot?OnboardingTestQuestions=JobMediation.Api.Models.Onboarding.ViewModels.OnboardingTestQuestion&OnboardingTestQuestions=JobMediation.Api.Models.Onboarding.ViewModels.OnboardingTestQuestion" method="post"> <div>
<p>
1. Question 1
</p>
<div>
<input type="radio" value="1dd8ff8d-fcaa-4a7d-b10f-e7c41bdd8c11" id="OnboardingTestQuestions_0__SelectedAnswerOptionId" name="OnboardingTestQuestions[0].SelectedAnswerOptionId">
<label><p>1. Option 1</p></label>
</div>
<div>
<input type="radio" value="37c6c1d3-40af-4fc0-a171-4546413c59f0" id="OnboardingTestQuestions_0__SelectedAnswerOptionId" name="OnboardingTestQuestions[0].SelectedAnswerOptionId">
<label><p>2. Option 2</p></label>
</div>
<div style="display:none">
<br>questionId: <input hidden="" type="text" required="" id="OnboardingTestQuestions_0__QuestionId" name="OnboardingTestQuestions[0].QuestionId" value="c90d42ff-a67e-42e2-9ef1-e61ad64f783f">
<br>questionText: <input hidden="" type="text" required="" id="OnboardingTestQuestions_0__QuestionText" name="OnboardingTestQuestions[0].QuestionText" value="Question 1">
</div>
<p>
2. Question 2
</p>
<div>
<input type="radio" value="a9021d17-86d5-4d08-a36a-eeb88661a756" id="OnboardingTestQuestions_1__SelectedAnswerOptionId" name="OnboardingTestQuestions[1].SelectedAnswerOptionId">
<label><p>1. Option A</p></label>
</div>
<div>
<input type="radio" value="9ed4e62c-2a7c-42d8-a2b6-6e97d2d07806" id="OnboardingTestQuestions_1__SelectedAnswerOptionId" name="OnboardingTestQuestions[1].SelectedAnswerOptionId">
<label><p>2. Option B</p></label>
</div>
<div style="display:none">
<br>questionId: <input hidden="" type="text" required="" id="OnboardingTestQuestions_1__QuestionId" name="OnboardingTestQuestions[1].QuestionId" value="0b420127-bfde-4a77-b109-683c4395da27">
<br>questionText: <input hidden="" type="text" required="" id="OnboardingTestQuestions_1__QuestionText" name="OnboardingTestQuestions[1].QuestionText" value="Question 2">
</div>
<button>Send</button>
</div>
<input name="__RequestVerificationToken" type="hidden" value="CfDJ8AnsrMzqwIVDvpNxYQXCuLVEqQaff31nYTXBVOW9EkiqYNmFWZHDGA2PfVBLPbbw_FTkHwn5ZsC7zmr1s8lYvxiXRwcCyVTOY4Lq2rbMfasFP4K_5XXEvY2TlqOOGFDUwpj1GHU1X7ZmRIDqHEh3UvU"></form>
POST 没有收到任何回复。为什么?我遗漏了什么?请帮忙!
使用下面的代码可以解决这个问题,这是测试结果。