前回まで見てきたように,ASP.NET AJAXでも標準でUpdatePanelやTimerのようなコントロールを提供していますが,あくまでこれらのコントロールが提供するのは汎用的な機能に留まります。個別の要件を実現しようとすれば,多くのコーディングが必要となる局面はまだまだ多いはずです。
ASP.NET AJAX Control Toolkitを利用することで,こうした個別の要件のいくつかをより少ないコードで実現することが可能になります。表1に,執筆時点(2006年11月6日時点)で提供されているASP.NET AJAX Control Toolkitのコントロールを列挙します。
コントロール名 | 概要 |
---|---|
Accordion | 開閉可能なマルチペインを生成 |
AlwaysVisibleControl | 指定コントロールをページ内の特定個所に常時表示(スクロール時にも合わせて自動スクロール) |
Animation | アニメーション効果を定義 |
CascadingDropDown | 階層式のドロップダウン・メニュー |
CollapsiblePanel | 開閉可能なパネル |
ConfirmButton | ボタンクリック時に確認ダイアログを表示 |
DragPanel | ドラッグ可能なパネル領域を生成 |
DropDown | SharePointスタイルのドロップダウン・メニューを生成 |
DropShadow | 既存コントロールにシャドウを付与 |
DynamicPopulate | Webサービス呼び出しの結果をページに反映 |
FilteredTextBox | 入力制限付きのテキストボックスを生成 |
HoverMenu | マウスホバー時にポップアップ可能なメニューを生成 |
ModalPopup | モーダルなポップアップウィンドウを生成 |
MutuallyExlcusiveCheckBox | 相互排他的なチェックボックスを生成 |
NoBot | ページにボット対策のチェック機能を付与 |
NumericUpDown | アップダウンボタン(数値や連続したリストなど)を生成 |
PagingBulletedList | ページング機能に対応した箇条書きリスト |
PasswordStrength | パスワード入力時にその強度を視覚的に表示 |
PopupControl | 入力コントロールなどにポップアップ・ダイアログを関連付け |
Rating | レーティング表示&登録機能を提供 |
ReorderList | ドラッグ&ドロップで標準の変更が可能なリストコントロール |
ResizableControl | コンテンツの表示サイズを変更可能なパネルを生成 |
RoundedCorners | 既存コントロールの角に丸みを付与 |
Slider | 数値入力のためのリッチなスライダーを生成 |
TextBoxWatermark | テキストボックスの背景に透かしを付与 |
ToggleButton | On/Offの切り替えが可能なトグルボタンを生成 |
UpdatePanelAnimation | 通信時に該当のパネルに対してアニメーション効果を付与 |
ValidatorCallout | 検証コントロールのエラー・メッセージ表示をカスタマイズ |
DropShadow/TextBoxWatermarkコントロールのように,既存のコントロールにちょっとした視覚効果を加えるものから,Animationコントロールのように高度にフレームワーク的な機能を提供するコントロールまで,様々なコントロールが用意されていることがおわかりになるでしょう。
表の説明だけではイメージしにくいコントロールもあると思います。具体的な動作イメージは,「ASP.NET AJAX Control Toolkit sample website」で確認できます。数も多いので,まずはデモページで実際の動作を確認し,興味を持ったものから実際に自分のアプリケーション上で動作させてみてはいかがでしょう(図1)。
図1:ASP.NET AJAX Control Toolkitサンプルページで動作を確認できるコントロール
●テキストボックスにポップアップ・ウィンドウを付与するPopupControlコントロール
●モーダル・ウィンドウを制御するModalPopupコントロール
●検証エラー・メッセージを吹き出し表示するValidatorCalloutコントロール
ASP.NET AJAX Control Toolkitのインストール
ASP.NET AJAX Control Toolkitは,ASP.NET AJAX本体には含まれていません。ASP.NET AJAX Control Toolkitで提供されるコントロールを利用するには,ASP.NET AJAXをインストールした環境にASP.NET AJAX Control Toolkitを改めて導入する必要があります。ダウンロードファイルは,ASP.NET AJAX同様,ASP.NET AJAXに関するMicrosoftの公式サイトから入手可能です。ダウンロードしたAjaxControlToolkit.zipを解凍すると,いくつかのフォルダが展開されますので,その中の一つである「/SampleWebSite/bin」フォルダに含まれるAjaxControlToolkit.dllを,自身のアプリケーション配下のbinフォルダにコピーしてください。
これで最低限,アプリケーションからASP.NET AJAX Control Toolkitの各コントロールを利用することが可能になります。フォームデザイナ上でもコントロールを利用できるように,ここではツールボックスへの登録作業も行っておきましょう。ツールボックスの[全般]タブを右クリック,表示されたコンテキストメニューから[アイテムの選択...]を選択します。
図2:[ツールボックスアイテムの選択]ダイアログ(クリックすると拡大表示します)
[ツールボックスアイテムの選択]ダイアログ(図2)が表示されますので,[参照...]ボタンをクリックし,先ほどアプリケーション上に配置したAjaxControlToolkit.dllを選択します。[.NET Frameworkコンポーネント]タブの一覧にいくつかのコントロールが追加され,かつ,チェックが入っていることを確認したうえで,[OK]ボタンをクリックしてください。図3のように,ツールボックス上にASP.NET AJAX Control Toolkitが提供するサーバーコントロールが追加されれば成功です。
図3:追加された拡張サーバーコントロール
【コラム】ASP.NET AJAX Control ToolKit対応テンプレートのインストール
ASP.NET AJAX本体同様,ASP.NET AJAX Control ToolKitでもVisual Studioに専用のテンプレートを導入することが可能です。インストールには,Control ToolKitのダウンロード・アーカイブ配下に含まれる「AjaxControlExtender/AjaxControlExtender.vsi」を使用します。「.vsi」ファイルをダブルクリックすると,以下のようなコンテンツ・インストーラが起動しますので(図A),あとはウィザードの指示に従って進めるだけでOKです(署名に関する注意ダイアログが表示される場合がありますが,特に問題ありませんので,そのまま継続してください)。
図A:[Visual Studioコンテンツインストーラ]ダイアログ(クリックすると拡大表示します)
インストール後にVS上から[新しいプロジェクト]ダイアログを確認すると「AJAX AJAX Control Project」テンプレート(自前のAJAXコントロールを作成するためのプロジェクト)が,[新しいWebサイト]ダイアログを確認すると,[マイテンプレート]に「AJAX Control Toolkit Web Site」テンプレート(Control ToolKitを利用するためのサイト構成)が,それぞれ追加されていることが確認できるはずです。
以上,今回はここまでです。最終回の次回は,ASP.NET AJAX Control Toolkitで提供されるサーバーコントロールの一つとして,CascadingDropDownコントロールを利用してみることにします。