.NET Core <select> 具有默认值？

Question

我的目标是生成一个 <select> 下拉列表，其中预先选择了某个选择值 (<option>)，因此最终确定的 HTML 应如下所示：

<select>
  <option value = "1">Option1</option>
  <option value = "2" selected>Option2</option>
  <option value = "3">Option3</option>
</select>

请注意，值为 2 的选项有一个selected 属性，表示它会在单击下拉菜单之前显示。我不能（并且正在尝试）使用 .NET Core Tag Helpers 来实现这一点。

这是我的模型（我认为你可以放心地忽略细节）：

public class ReportViewModel
{
  [Display(Name = "Pick a form")]
  public IEnumerable<Form> AvailableForms { get; set; }

  public Form SelectedForm { get; set; }

  public List<ReportData> FormResponses { get; set; }
}

请注意，那里的 Form 对象只有 Id 和 Name 属性。

这是我的选择语句：

<label asp-for="SelectedForm.Name" class="form-control-label font-weight-bold"></label>
<select asp-for="SelectedForm.Name"
        class="form-control"
        onchange ="onFormSelected(this.value)"
        asp-items="@(new SelectList(Model.AvailableForms, "Id", "Name"))">
</select>

我在Microsoft Guide 中没有看到答案 或blog on the topic

Answer 1

基本上您需要将选择设置为使用SelectedForm.Id 属性，然后指定要在控制器中选择的表单的值。我不得不稍微更新你的代码，但这对我有用 -

<label asp-for="SelectedForm" class="form-control-label font-weight-bold"></label>
<select asp-for="SelectedForm.Id"
        class="form-control"
        onchange ="onFormSelected(this.value)"
        asp-items="@(new SelectList(Model.AvailableForms, "Id", "Name"))">
</select>

然后在你的控制器中

var vm = new ReportViewModel()
{
    AvailableForms = new List<Form>()
};

var form2 = new Form() { Id = 2, Name = "Bar" };
(vm.AvailableForms as List<Form>).Add(new Form() { Id = 1, Name = "Foo" });
(vm.AvailableForms as List<Form>).Add(form2);
(vm.AvailableForms as List<Form>).Add(new Form() { Id = 3, Name = "Baz" });

vm.SelectedForm = form2;

return View(vm);

Answer 2

SelectList 构造函数可以接受一个附加参数，即selectedValue。在你的情况下，你应该能够通过它，我认为看起来像这样：

asp-items="@(new SelectList(Model.AvailableForms, "Id", "Name", Model.SelectedForm.Id))"

我认为asp-for 对您不起作用的原因是SelectedForm.Name（它是一个字符串）的值与您在@987654329 中使用的Id 属性的值不匹配@构造函数（这是一个整数？）。

您可以在源代码中部分了解其工作原理。你最终会在GenerateOption 中找到here：

var selected = item.Selected;
if (currentValues != null)
{
    var value = item.Value ?? item.Text;
    selected = currentValues.Contains(value);
}

此时，我相信currentValues 将包含一个元素，这将是一个字符串 (Form.Name)。我也相信item.Value 将是例如"1" 所以没有匹配。

Answer 3

这是旧的，但我没有在这里看到我的方法。 使用控制器中的 viewbag 将其传入。

<select>
    <option>@ViewBag.selected</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>