シリーズ３つ目の今回はデータバインドなドロップダウンコントロール WebDropDown と WebDataGrid に追加された機能をご紹介します。
WebDropDown とは？
| オートコンプリート機能 ユーザーが入力した値がドロップダウンにすでに存在する場合はオートコンプリート機能によって項目が自動的にハイライトされます。アプリケーションがユーザーに入力する選択肢を提案することで、スピーディーな項目選択が可能になります。 項目のテンプレート化 そしてこのコントロールが ASP.NET AJAX を使用して作成されたことによる大きな機能拡張は標準化されたデータバインディングを使った項目のテンプレート化です。 各項目のデータは Xml, SqlDataSource, Linq など様々なデータソースから取得されますが、画像や他の ＵＩ コントロールを含むことができれば連携してもっとリッチなドロップダウンコントロールが作成できますよね。 |  |
そこで使えるのが WebDropDown の項目テンプレートです。
| 
| WebDropDown の項目のレイアウトはテンプレート化されています。テンプレートの中ではおなじみの DataBinder を使用してバインドされたデータの項目を好きな所に表示させ、項目の表示を自由にカスタマイズすることができるようになっています。
下記のコードは左のような WebDropDown の項目表示をさせるためのテンプレートのサンプルですが、データバインディングされたフィールド (ThumbnailUrl, Name, LastUpdate) を指定するのに、おなじみの .NET データバインディング構文を使っています。 |
<itemtemplate> <table style="width: 100%; border-bottom: #ff0000 1px solid" cellspacing="0" cellpadding="0">
<tr>
<td style="padding-right: 10px; width: 71px" rowspan="3">
<asp:image runat="server" height="94" width="71" imageurl="
<%# DataBinder.Eval(Container.DataItem, "ThumbnailUrl") %>" /> </td>
<td style="padding-left: 10px; width: 150px; border-bottom: #e8e8e8 1px solid; text-align: left">
<%# DataBinder.Eval(Container.DataItem, "Name")%>
</td>
</tr>
<tr>
<td style="padding-left: 10px; border-bottom: #e8e8e8 1px solid; text-align: left">
更新日：
<%# DateTime.Parse(DataBinder.Eval(Container.DataItem, "LastUpdate").ToString()).ToShortDateString() %> </td>
</tr>
<tr>
<td style="padding-left: 10px; text-align: left">
<%# DataBinder.Eval(Container.DataItem, "Summary").ToString().Substring(0, 30) + "..." %> </td>
</tr>
</table>
</itemtemplate> 来週に開催を控えた インフラジスティックス Developer Days 5 (満員御礼！)では WebDropDown これらの機能が実際に動作しているところをお見せするつもりです。Developer Days の見どころについては弊社エバンジェリスト山田のブログで紹介しておりますのでそちらもご覧ください。
WebDataGrid の新機能
WebDropdown 同様に ASP.AJAX をフル活用した新しい WebDataGrid には今回のリリースで新しく列移動の機能が追加されました。列をドラッグすると移動可能な場所に下のようなマークが付きます。
さらに、上記の WebDropDown 用に EditorProvider が用意されたことで WebDropDown を セルのエディタとして使用できるようになりました。
2009 Volume 1 で追加された他の機能につきましては今までのシリーズ記事をご覧ください。
また Windows Forms と WPF 製品がはいった NetAdvantage WinClient については機能紹介が弊社エバンジェリスト池原のブログに記載されておりますのでそちらも合わせてご覧ください。
次回はシリーズ最終回、WebDataMenu と ドラッグアンド ドロップ フレームワークのご紹介です。
の全ての投稿を閲覧する