web-dev-qa-db-ja.com

.NET Core <select> with Default Value?

私の目標は、特定の選択値(<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プロパティが含まれていることに注意してください。

これは私のselectステートメントです:

<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 または トピックに関するブログ に回答がありません

8
VSO

基本的に、SelectedForm.Idプロパティを使用するようにselectを設定し、コントローラーで選択するフォームの値を指定する必要があります。コードを少し更新する必要がありましたが、これでうまくいきました-

<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);
3
Tony Ranieri

SelectListコンストラクタは、追加の引数、つまり selectedValue を取ることができます。あなたの場合、これを通過させることができるはずです、それを私はthinkは次のようになります:

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

asp-forが機能しない理由は、SelectedForm.Name(文字列)の値と、使用しているIdプロパティの値の不一致にあると思いますSelectListコンストラクター(これは整数ですか?).

これがソースコードでどのように機能するかを部分的に見ることができます。あなたは hereGenerateOptionに入れます:

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

この時点で、currentValuesには文字列(Form.Name)になる単一の要素が含まれると思います。また、item.Valueは、 "1"なので、一致するものはありません。

2
Kirk Larkin