More than 5 years have passed since last update.

ASP.NET の DropDownList にて optgroup を使う

Posted at 2018-05-09

はじめに

ページ主体の ASP.NET アプリケーションで動的に DropDownList を作る際に optgroup に対応したいケースがあり、調べたら複数の方法がありましたので参考先を含めて記します。

正攻法のような気がしますが、DropDownList 一つに対応するには工数が大きい。グループが必要な DropDownList をたくさん持つ Web アプリをこれから作るのでしたらこれを採用するのがよいでしょう。

C# のコードですが、VB にも移植できます。ですが、移植しただけではエラーになりました。RenderListItem() メソッドの最後に以下のコードが必要です。

Page.ClientScript.RegisterForEventValidation(Me.Control.UniqueID, item.Value)

ListItem の Attributes プロパティに data としてグループを追加して、JavaScript で書き換えるというものです。jQuery を使えば簡単ですし、下記にサンプルがあります。

jQuery に慣れていないと、どのような仕組みになっているか理解するのに頭をひねるかもしれません。またサーバー側のコードでコントロールを初期化して、クライアント側で更に加工しないと初期化が終らない気持ち悪さがあるかもしれません。

こちらもそのまま使ったら動きませんでした。jQuery のバージョンによるのかもしれません。$(this)[0] を２箇所 this にするなど、いくつか変更して使いました。

JavaScript 側に（クライアント側に）データだけを渡し、クライアント側で DropDownList を作成、サーバー側は Request.Form で受け取るという方法もあります。そうなるともう ASP.NET を使う旨みがあまりありませんね。

開発開始時に ASP.NET MVC を採用すれば、最近のバージョンでは対応しているようです（ページ主体の ASP を使うケースのほうがまれなのかもしれません）。

以下の理由から二番目の方法（JavaScript でグループだけ追加する）を採用しました。