我在剃须刀页面上有项目列表,用户可以在前端使用javascript更新这些页面:
<select asp-for="Answers" asp-items="Model.Answers" multiple="multiple"></select>
我也有此列表的bind属性:
[BindProperty]
public List<SelectListItem> Answers { get; set; } = new List<SelectListItem> { new SelectListItem("Test1", "Test1") };
当我在页面加载时传递数据时,绑定工作正常,但提交表单时列表为空。
这是按下“提交”按钮之前的HTML代码:
<select id="answersList" multiple="multiple" data-val="true" name="Answers">
<option value="Test1">Test1</option>
<option value="Test2">Test2</option>
<option value="Test3">Test3</option>
</select>
如您所见,代码中的列表为空。如何传递用户添加到后端的项目?
其他绑定属性具有正确的数据。因此,问题仅在此列表上。
如果捕获请求并检查您在浏览器F12开发人员工具“网络”选项卡中发布的实际数据,您将发现它如下所示。
不能绑定到List<SelectListItem>
type属性Answers
。
如何传递用户添加到后端的项目?
为了满足您的要求,您可以尝试修改如下代码。
在PageModel类中定义List<string>
类型属性SelectedAnswers
public List<SelectListItem> Answers { get; set; } = new List<SelectListItem> { new SelectListItem("Test1", "Test1") };
[BindProperty]
public List<string> SelectedAnswers { get; set; }
使用更新更新标签助手 asp-for="SelectedAnswers"
<form method="post">
<select asp-for="SelectedAnswers" asp-items="Model.Answers" multiple="multiple"></select>
<input type="submit" value="Submit" />
</form>
测试结果
更新:
我没有从选择列表中选择任何选项,因此没有任何项目。但是,我不想让用户选择选项。我想发布所有这些。有没有一种简单的方法,还是应该在提交之前使用JavaScript代码选择所有项目?
您可以在将新的SelectListItem添加到时,尝试将所有SelectListItem设置为默认选中List<SelectListItem> Answers
,如下所示。
//...
Answers.Add(new SelectListItem("Test2", "Test2", true));
Answers.Add(new SelectListItem("Test3", "Test3", true));
//...
此外,正如您提到的,在提交表单之前,还可以实现使用JavaScript将所有项目/选项设置为选中状态。
$("form").first().submit(function () {
$('#myList option').prop('selected', true);
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句