在 MVC 6 中,如何在视图中编写复选框列表并将选中的值传递给控制器? [英] In MVC 6, how to code checkbox list in view and pass the checked values to the controller?
问题描述
抱歉,我的大部分搜索都将我带到旧的 MVC 代码.任何帮助将不胜感激.
在带有标签助手的 MVC 6 中,您如何编写一组复选框:
- 对标签使用标签助手,因此点击它会切换选中的值
- 将选中的值保存(绑定?)到 IsOptionSelected 属性
- 点击提交后将这些检查的值传回控制器
?
我能够正确显示带有标签的复选框,但我不知道如何通过模型将选中的值传递回控制器.现在,IsOptionSelected 值返回为 false.
我还能够使标签帮助程序的 html 帮助程序工作,但不能为标签帮助程序工作.我也可能把这些编码都弄错了,所以任何提示都会有所帮助!
这是我目前所拥有的:
显示:
实体:
公共类PhoneOption{public bool IsOptionSelected { 获取;放;} = 假;公共 int OptionId { 获取;放;}公共字符串 OptionName { 获取;放;}}
型号:
[Display(Name = "Phone Options")]公共 IEnumerable电话选项 { 得到;放;}....PhoneOptions = repository.GetPhoneOptions();
存储库:
public IEnumerable获取电话选项(){IEnumerable选项=新[]{new PhoneOption { OptionId = 1, OptionName = "Phone Case", IsOptionSelected = false },new PhoneOption { OptionId = 2, OptionName = "Screen Protector", IsOptionSelected = false },new PhoneOption { OptionId = 3, OptionName = "Car Charger", IsOptionSelected = false },new PhoneOption { OptionId = 4, OptionName = "Extra Cable", IsOptionSelected = false }};退货选项;}
查看:
<label class="control-label">电话选项</label><div>@foreach(Model.PhoneOptions 中的 var 选项){<div>@{ string cbId = "PhoneOption_" + @option.OptionId;}<input asp-for=@option.IsOptionSelected type="checkbox" value=@option.IsOptionSelected id=@cbId name=@cbId/>@Html.Label(@cbId.ToString(), @option.OptionName)@*这是导致无效操作异常*@@**@<span asp-validation-for=@cbId class="text-danger" role="alert"></span>}
提前致谢!
这就是我为了让它工作而最终所做的事情.我不确定这是否是最好的方法.我不得不仍然使用 html 助手,因为标签助手不起作用.
型号:
public List电话选项 { 得到;放;}...PhoneOptions = repository.GetPhoneOptions().ToList();
查看:
@if (@Model.PhoneOptions != null && @Model.PhoneOptions.Count() > 0){for (int i = 0; i <@Model.PhoneOptions.Count(); i++){<div><input asp-for="@Model.PhoneOptions[i].IsOptionSelected" type="checkbox"/><label asp-for="@Model.PhoneOptions[i].IsOptionSelected">@Model.PhoneOptions[i].OptionName</label>@*如果不包括这些,则所有 OptionIds 变为 0,所有 OptionName 变为 null*@@Html.HiddenFor(x => @Model.PhoneOptions[i].OptionId)@Html.HiddenFor(y => @Model.PhoneOptions[i].OptionName)
}}
我希望这可以帮助遇到相同复选框列表问题的其他人.
更新:我已经更新了 html 助手以标记上面的助手.
Sorry but most of my searches take me to old MVC codes. Any help will be appreciated.
In MVC 6 with tag helpers, how do you code a set of checkboxes:
- Use tag helper for label so clicking it will toggle the checked value
- Save (Bind?) the checked value to the IsOptionSelected property
- Pass these checked values back to Controller after clicking Submit
?
I was able to display the checkboxes with labels correctly, but I do not know how to pass the checked values back to the controller via the model. Right now, IsOptionSelected values are coming back as false.
I was also able to make the html helper for the label work but not for the tag helper. I may be also coding these all wrong so any tips will help!
Here's what I have so far:
Display:
Entity:
public class PhoneOption
{
public bool IsOptionSelected { get; set; } = false;
public int OptionId { get; set; }
public string OptionName { get; set; }
}
Model:
[Display(Name = "Phone Options")]
public IEnumerable<PhoneOption> PhoneOptions { get; set; }
. . . .
PhoneOptions = repository.GetPhoneOptions();
Repository:
public IEnumerable<PhoneOption> GetPhoneOptions()
{
IEnumerable<PhoneOption> options = new[]
{
new PhoneOption { OptionId = 1, OptionName = "Phone Case", IsOptionSelected = false },
new PhoneOption { OptionId = 2, OptionName = "Screen Protector", IsOptionSelected = false },
new PhoneOption { OptionId = 3, OptionName = "Car Charger", IsOptionSelected = false },
new PhoneOption { OptionId = 4, OptionName = "Extra Cable", IsOptionSelected = false }
};
return options;
}
View:
<div class="form-group">
<label class="control-label">Phone Options</label>
<div>
@foreach (var option in Model.PhoneOptions)
{
<div>
@{ string cbId = "PhoneOption_" + @option.OptionId; }
<input asp-for=@option.IsOptionSelected type="checkbox" value=@option.IsOptionSelected id=@cbId name=@cbId />
@Html.Label(@cbId.ToString(), @option.OptionName)
@*This is causing invalid operation exception*@
@*<label asp-for=@cbId.ToString()>@option.OptionName</label>*@
<span asp-validation-for=@cbId class="text-danger" role="alert"></span>
</div>
}
</div>
</div>
Thanks in advance!
This is finally what I did to make it to work. I am not sure if this is the best way to do it. I had to still use the html helpers because the tag helpers do not work.
Model:
public List<PhoneOption> PhoneOptions { get; set; }
. . .
PhoneOptions = repository.GetPhoneOptions().ToList();
View:
@if (@Model.PhoneOptions != null && @Model.PhoneOptions.Count() > 0)
{
for (int i = 0; i < @Model.PhoneOptions.Count(); i++)
{
<div>
<input asp-for="@Model.PhoneOptions[i].IsOptionSelected" type="checkbox" />
<label asp-for="@Model.PhoneOptions[i].IsOptionSelected">@Model.PhoneOptions[i].OptionName</label>
@*If these are not included, all OptionIds become 0 and all OptionName becomes null*@
@Html.HiddenFor(x => @Model.PhoneOptions[i].OptionId)
@Html.HiddenFor(y => @Model.PhoneOptions[i].OptionName)
</div>
}
}
I hope this helps someone else who is having the same checkbox list issues.
UPDATE: I've updated the html helpers to tag helpers above.
这篇关于在 MVC 6 中,如何在视图中编写复选框列表并将选中的值传递给控制器?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!