C# ＠ListBoxFor 使い方

Question

Visual Studio 2022 ASP.NET Core MVC アプリをフレームワーク .NET 6.0 で作成しています。
モデルのデータをリストボックスに表示させたいと思っています。
しかし、＠Html.ListBoxForの使い方があまりネットに落ちていなく困っています。
@Html.DropDownListForは表示できましたが、リストボックスで表示しようとすると
「複数選択が許可されている場合、パラメーター'expression'はIEnumerableに評価される必要があります」
と出てしまいます。

//HTML
 @Html.ListBoxFor(
    model => model.IngredientsName,         // プロパティ
   (IEnumerable<SelectListItem>)ViewBag.PlanmIngredient,  // 選択オプ
   new { @class = "select2_multiple form-control" , @id = "IngredientsName}  // その他の属性
    ) 

//Controller
 public async Task<IActionResult> Edit(int? id)
        {
            ViewBag.PlanmIngredient = _context.MIngredients.ToArray().Select(m =>
            new SelectListItem() { Value = m.Id.ToString(), Text = m.IngredientsName });
            if (id == null)
            {
                return NotFound();
            }
            var mIngredient = await _context.MIngredients.FindAsync(id);
            if (mIngredient == null)
            {
                return NotFound();
            }
            return View(mIngredient);
        }
//Model
 public string IngredientsName { get; set; } = null!;

追記

SurferOnWww
DropDownListFor では何故ダメなのですか？　複数項目を選択できるようにしたいからですか？

それとも単に見かけの問題だけで選択できる項目は単一でよいが、ドロップダウン形式でクリックして開いて項目を表示するのではなく、箱 (ListBox) に複数項目を表示し箱に収まらない項目はスクロールして見る形にしたいということですか？

tomokia

引用テキスト複数項目選択できるようにしたいからです。

Comments

[退会済みユーザー]

DropDownListFor では何故ダメなのですか？　複数項目を選択できるようにしたいからですか？

それとも単に見かけの問題だけで選択できる項目は単一でよいが、ドロップダウン形式でクリックして開いて項目を表示するのではなく、箱 (ListBox) に複数項目を表示し箱に収まらない項目はスクロールして見る形にしたいということですか？

[tomokia]

複数項目選択できるようにしたいからです。

[退会済みユーザー]

質問欄を編集して追加情報として追記願います。

ところで、それを受けるアクションメソッド側では複数の選択項目を受けとるための対応はされているのですか？

[tomokia]

ListBoxForは複数取得したい場合ですのでその追加情報は必要ないかと思いますが...
受け取る側について、一切いじっていませんでした。参考サイト等ありましたら教えてください。

[退会済みユーザー]

> ListBoxForは複数取得したい場合ですのでその追加情報は必要ないかと思いますが...

いや、書いてください。

上のコメントに書きましたが、「それとも単に見かけの問題だけで選択できる項目は単一でよいが、ドロップダウン形式でクリックして開いて項目を表示するのではなく、箱 (ListBox) に複数項目を表示し箱に収まらない項目はスクロールして見る形にしたい」ということかもしれないと想像してました。なぜなら、Edit で複数項目の選択を行うことは考えにくいから。回答者がそういう無駄な想像をしなくて済むよう書いてください。

[tomokia]

承知しました

[退会済みユーザー]

引用は文の頭に > を付けてください。

Answer 1

エラーの原因は多分 ListBox へのデータの渡し方だと思います。

質問のアクションメソッド名が Edit となっているということは既存のレコードの編集ですよね。とすると初期画面で ListBox に表示された項目一覧では既存のレコードの値が選択された状態で表示するのだと想像しています。

であれば、Controller でデータベースからデータを取得したらそれを SelectList に加工してから ListBox に渡すのがお勧めです。

具体例は以下の記事を見てください。

DropDownList への SelectList の渡し方 (CORE)
http://surferonwww.info/BlogEngine/post/2021/01/22/how-to-pass-selectlist-to-dropdownlist-in-aspnet-core-mvc.aspx

上の記事では DropDownList を使っていますが、ListBox との違いは、ListBox では生成される html に自動的に multiple = "multiple" がつくことだけです。

紹介した記事のコード、

@Html.DropDownList("CategoryId", null,
    htmlAttributes: new
    {
        @class = "form-control",
        multiple = "multiple"
    })

は、以下と同じです。

@Html.ListBox("CategoryId", null,
    htmlAttributes: new
    {
        @class = "form-control"
    })

DropDownListFor, ListBoxFor も使えますが引数の渡し方が違ってきます。どうしてもということではないはずなので、とりあえず忘れてください。

ASP.NET Core MVC では Tag ヘルパー使えますので、DropDwonList や ListBox より select タグヘルパーを使う方が良いと思います。

選択タグ ヘルパー
https://docs.microsoft.com/ja-jp/aspnet/core/mvc/views/working-with-forms?view=aspnetcore-6.0#the-select-tag-helper

紹介した記事には select タグヘルパーを使ったサンプルもありますので見て検討して見てください。