ASP.NET MVCとASP.NET AJAX Control Toolkit
ASP.NET MVCでの開発はクライアントサイドスクリプト抜きには語れないと言っても過言ではありません。プロジェクトに標準で付加されているjQueryやMicrosoft AJAX LibraryなどのJavaScriptライブラリを活用することが多いことでしょう。本項ではASP.NETユーザーにとって馴染み深いControl Toolkitが提供しているJavaScriptライブラリを活用したASP.NET MVCのサイト構築方法を学びます。
ASP.NET MVCでAJAX Control Toolkit
それでは、さっそくASP.NET AJAX Control ToolkitをASP.NET MVCのサイト上で利用する方法について紹介します。
ASP.NET MVCでは紹介済みの通りサーバーコントロールを利用しないため、本来であればAJAX Control Toolkitは利用できません。しかし、必要な環境の所にも書いたようにAJAX Control Toolkitは現在ScriptファイルとCSS/GIFなどを格納したScriptFilesOnly版も公開されています。こちらを利用して、ダイレクトにスクリプトを活用することで、AJAX Control Toolkitの機能をASP.NET MVCのサイト上でも利用できるようになります（図6～図7）。
AJAX Control Toolkitを利用するスクリプトを知る方法
ScriptFilesOnly版は数多くのスクリプトが格納されています。例えば、CalendarExtenderの機能を利用したい！と思っていても、それを表示させるためには次の項目を知っている必要があります。
- どのようなスクリプトファイルが必要なのか？
- どの順番でスクリプトファイルを読み込ませるか？
- どのように記述してスクリプト実行するか？
理想は時間をかけてScriptFilesOnlyにあるファイルに目を通して知れればいいのですが、開発者の方は往々にして時間に追われていることがあります。そのため、ちょっとした工夫をしてみましょう。多少手間はかかりますが、最適化されたScriptを改行して読み進めるよりは現実的です。
CalendarExtenderコントロールのスクリプトを知る
それでは見た目にも分かりやすいCalendarExtenderコントロールを例に見てみましょう。
（1）Scriptファイルの数と種類、宣言順を調べる
AJAX Control TookitはScriptFilesOnly版の他に、Extenderコントロールのソースが含まれているAjaxControlToolkitSource版があります。こちらを別途ダウンロードして、Extender名.debug.jsファイルを参照すれば記述されています。
CalendarBehavior.debug.jsファイルを開くと、上部に次の参照コードが記述されています。
/// <reference name="MicrosoftAjax.debug.js" /> /// <reference name="MicrosoftAjaxTimer.debug.js" /> /// <reference name="MicrosoftAjaxWebForms.debug.js" /> /// <reference path="../ExtenderBase/BaseScripts.js" /> /// <reference path="../Common/Common.js" /> /// <reference path="../Common/DateTime.js" /> /// <reference path="../Common/Threading.js" /> /// <reference path="../Compat/Timer/Timer.js" /> /// <reference path="../Animation/Animations.js" /> /// <reference path="../Animation/AnimationBehavior.js" /> /// <reference path="../PopupExtender/PopupBehavior.js" />
上記のソースから、必要なスクリプト（CSS）と読み込み順が下記と分かります。
- MicrosoftAjax.debug.js
- ExtenderBase/BasScripts.js
- Common/Common.js
- Common/DateTime.js
- Common/Threading.js
- Compat/Timer/Timer.js
- Animation/Animations.js
- Animation/AnimationBehavior.js
- PopupExtender/PopupBehavior.js
- Calendar.CalendarBehavior.js（自分自身も追加）
ASP.NET MVCでは、MicrosoftAjaxTimer.debug.js、MicrosoftAjaxWebForms.debug.jsの2ファイルは存在していないので追加はしません。また、CalendarBehavior.jsファイル自身は記述されていないので、末尾に追加します。以上のスクリプトファイルが実行するために必要なファイルです。
