今回取り上げるASP.NET AJAX Control Toolkitは,ASP.NET AJAXをベースに構築されたサーバー・コントロール集です。

 前回まで見てきたように,ASP.NET AJAXでも標準でUpdatePanelやTimerのようなコントロールを提供していますが,あくまでこれらのコントロールが提供するのは汎用的な機能に留まります。個別の要件を実現しようとすれば,多くのコーディングが必要となる局面はまだまだ多いはずです。

 ASP.NET AJAX Control Toolkitを利用することで,こうした個別の要件のいくつかをより少ないコードで実現することが可能になります。表1に,執筆時点(2006年11月6日時点)で提供されているASP.NET AJAX Control Toolkitのコントロールを列挙します。

表1:ASP.NET AJAX Control Toolkitで提供される28のコントロール(2006年11月時点)
コントロール名概要
Accordion開閉可能なマルチペインを生成
AlwaysVisibleControl指定コントロールをページ内の特定個所に常時表示(スクロール時にも合わせて自動スクロール)
Animationアニメーション効果を定義
CascadingDropDown階層式のドロップダウン・メニュー
CollapsiblePanel開閉可能なパネル
ConfirmButtonボタンクリック時に確認ダイアログを表示
DragPanelドラッグ可能なパネル領域を生成
DropDownSharePointスタイルのドロップダウン・メニューを生成
DropShadow既存コントロールにシャドウを付与
DynamicPopulateWebサービス呼び出しの結果をページに反映
FilteredTextBox入力制限付きのテキストボックスを生成
HoverMenuマウスホバー時にポップアップ可能なメニューを生成
ModalPopupモーダルなポップアップウィンドウを生成
MutuallyExlcusiveCheckBox相互排他的なチェックボックスを生成
NoBotページにボット対策のチェック機能を付与
NumericUpDownアップダウンボタン(数値や連続したリストなど)を生成
PagingBulletedListページング機能に対応した箇条書きリスト
PasswordStrengthパスワード入力時にその強度を視覚的に表示
PopupControl入力コントロールなどにポップアップ・ダイアログを関連付け
Ratingレーティング表示&登録機能を提供
ReorderListドラッグ&ドロップで標準の変更が可能なリストコントロール
ResizableControlコンテンツの表示サイズを変更可能なパネルを生成
RoundedCorners既存コントロールの角に丸みを付与
Slider数値入力のためのリッチなスライダーを生成
TextBoxWatermarkテキストボックスの背景に透かしを付与
ToggleButtonOn/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コントロールを利用してみることにします。

 本連載はASP.NET AJAX β2リリース(2006年11月06日時点)の情報を基に執筆しています。今後のRelease Candidate版,正式版などでは仕様が変更される可能性がありますのでご注意ください。