Question

我有一个基本模型

public class SpeakerConsent
{
    public string FieldLabel { get; set; }
    public List<SelectListItem> OptionValues { get; set; }
}

我的剃须刀页面当前如下所示

@for (var i = 0; i < Model.OptionValues.Count(); i++)
{
    @Html.RadioButtonFor(x => Model.OptionValues[i].Selected, Model.OptionValues[i].Value )
}

我的OptionValue中可能有4或5个项目。

问题：如何绑定到SelectListItem的Selected属性，以便在发布模型时可以识别选择了哪个单选按钮？

Answer 1

使用当前代码，为输入元素生成的HTML标记如下所示

<input data-val="true" name="OptionValues[0].Selected" type="radio" value="201">

名称是Selected，值是一个数字。 Selected的{{1}}属性是SelectListItem类型。当您发布此表单数据时，模型绑定将无法正常工作。

恕我直言，处理这种情况的最简单方法是使用编辑器模板。

我将首先创建一个类，该类代表我要与单选按钮一起使用的数据。

bool

现在在主视图模型中，我将添加一个集合类型属性

public class MyOption
{
    public bool IsSelected { set; get; }
    public int Id { set; get; }
    public string Text { set; get; }
}

现在在您的public class SpeakerConsent { public List<MyOption> Options { set; get; } }目录中，创建一个名为~/Views/Shared/的文件夹，然后在其中创建一个名为EditorTemplates的视图。您可以具有要用来呈现单选按钮的HTML标记。在这里，我将MyOption.cshtml属性与单选按钮和标签一起保留在隐藏字段中。

Id

现在，在GET操作中，您可以填充@model YourNamespace.MyOption <div> <span>@Model.Text</span> @Html.HiddenFor(g=>g.Id) @Html.RadioButtonFor(b => b.IsSelected, true) </div>视图模型对象的Options属性，并将其发送到视图。

SpeakerConsent

现在在主视图中，您只需调用public ActionResult Create() { var vm = new SpeakerConsent(); vm.Options = new List<MyOption> { new MyOption { Id=1, Text="Seattle"}, new MyOption { Id=2, Text="Detroit"}, new MyOption { Id=31, Text="Kerala"}, }; return View(vm); }帮助方法即可。

EditorFor

确保检查此代码生成的HTML标记。注意输入的@model YourNamespace.SpeakerConsent @using (Html.BeginForm("Index", "Home")) { @Html.EditorFor(a=>a.Options) <button type="submit">Save</button> }属性值。

提交表单后，您可以读取name属性值，循环浏览它们，并读取Options和Id属性值并根据需要使用它们

IsSelected

剃刀将单选框绑定到SelectListItem的列表

1 个答案: