jQueryをASP.NETでラップする

ASP.NET C# JavaScript

世の中にはJavaScriptで開発されたAjaxライブラリ（prototype.js、Dojoなど）が星の数ほどあるが、Webアプリの開発には、基本的にASP.NETを使うということもあり、ASP.NET自体、生のJavaScriptとの親和性があまり高くないので出番が少ないため、あまり興味がなかった。
しかも今ならASP.NET Ajax Extensionsがあるので、そういう事は全てそっちに任せる事ができるのでなおさら。

しかし、マイコミジャーナルの以下の記事を読んで「jQuery」なるAjaxライブラリに興味を持った。
jQuery 1.2登場!! - 16日には新UIを公開予定

jQueryはJavaScriptで開発された軽量なAjaxフレームワーク。
動作が高速でサイズも小さいという特徴がある。XPathを指定して動作する仕組みを採用している点も特徴的

これを使うとリッチなUIを簡単に作成する事ができる。実際に使ってみたが、本当に簡単だった。
で、なんか気に入ったので（特に名前）これをASP.NETのサーバーコントロールでラップして、VisualStudioでポトペタ（RAD）開発できるようにしようと思い立った。

ということで今回からjQueryをラップしたサーバーコントロールをいくつか開発していく。
まずは簡単なところから、内部のコンテンツを伸縮可能なパネルコントロール「CollapsablePanel」を開発する。

プロジェクトの準備

以下からjQueryの最新版をダウンロードする。
jQuery 1.2.1

開発にはVisualStudio2005 + SP1.0（やったかな？）を使用する。言語はもちろんC#。

１．「jQueryWebControls」という名前で「Web コントロールライブラリ」プロジェクトを作成する。
プロジェクト構成

２．「規定の名前空間」を「JQuery」に設定する。
３．「script」フォルダにjQueryのモジュールを配置し、「ビルドアクション」を「埋め込まれたリソース」に変更する。
４．「AssemblyInfo.cs」に以下の属性を宣言する。

[assembly: TagPrefix("JQuery.Web.UI", "jQuery")]
[assembly: WebResource("JQuery.script.jquery-1.2.1.js", "text/javascript")]

「TagPrefix」属性は独自のサーバーコントロールをaspxファイルで利用する場合に使用される
タグプリフィックスを定義するもの。
↓こういうこと

<jQuery:CollapsablePanel runat="server"></jQuery:CollapsablePanel>

「WebResource」属性はアセンブリに埋め込んだリソース（ここではJavaScript）をWebページからリンクできる
ように、自動的にリソースにWebアドレスを割り当てるためのもの。

５．次はこのライブラリをテストするためのWebサイト「jQuerySite」を「ASP.NET Web アプリケーション」プロジェクトで作成する。
プロジェクト構成

６．「参照設定」で「jQueryWebControls」プロジェクトを参照する。
７．「Web.config」に以下の設定を追加する。

<configuration>
    <system.web>
        <pages>
            <controls>
                <add tagPrefix="jQuery" namespace="JQuery.Web.UI" assembly="jQueryWebControls"/>
            </controls>
        </pages>
    </system.web>
</configuration>

この設定を追加する事で、jQueryWebControlsのサーバーコントロールには自動的に「jQuery」というタグプリフィックスが使用されるようになる。

これで準備完了。