Shoeisha Technology Media

CodeZine(コードジン)

特集ページ一覧

触ってみようASP.NET 2.0 AJAX Extensions

Microsoft ASP.NET AJAXの利用方法を学習する

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2006/12/25 00:00

MicrosoftのAJAXフレームワーク、「ASP.NET AJAX」の本格リリースが近づいてきました。本稿では、JavaScriptを理解しなくともAJAXの技術を利用することが可能なASP.NET 2.0 AJAX Extensionsについて解説します。特に、一番有効的に活用することが可能なUpdatePanelコントロール、UpdateProgressコントロールの2点については細かく触れていきます。

目次

はじめに

 ASP.NET AJAXはASP.NET 2.0上で動作するAJAXの技術セットで、アドインとして利用することができます。ASP.NET AJAXのフレームワークはJavaScriptで書かれていて、クライアントサイド(JavaScript+DHTML)中心の開発手法とサーバーサイド(ASP.NET 2.0)中心の開発手法があり、使用しやすい方を中心に利用することができます。

 クライアントサイドの特徴として、JavaScriptを記述する際のオブジェクト指向のサポート、独自の名前空間やJSONシリアライザのサポートにより、開発を容易に行えるようになっています。しかしクライアントサイド中心の開発では、基本的なAJAXの動作原理とJavaScript+DHTMLに精通していることが必要になります。

 一方、サーバーサイド中心の開発では、サーバーサイドのコントロールとして、AJAXの機能を持ったコントロールがあらかじめ用意されており、それらをWebページ上に配置して必要なプロパティを設定することで、WebページにAJAXの機能を付加させることができます。そのため、ASP.NET 2.0の開発者なら、違和感なくこれらのコントロールを利用することができます(図1)。

 今回はASP.NET 2.0 AJAX Extensions(以下、AJAX Extensions)しか扱いませんが、ASP.NET AJAXは全部で3種類(現在は4種類)の構成でなっています(図1)。

図1 Microsoft ASP.NET AJAX全体図
図1 Microsoft ASP.NET AJAX全体図
  • Microsoft AJAX Library
    クライアントサイドの技術で、JavaScript+DHTMLで開発をすることができる人向けのAJAX Libraryです。サーバーサイドの技術がASP.NETだけに限定されないという特徴があります(PHP、Java、Cold Fusionなどの技術が利用可能です)。
  • ASP.NET 2.0 AJAX Extensions
    AJAXの機能を持ったコントロールを使っていくことで、JavaScriptを知らなくてもAJAXを利用できる、サーバーサイドの技術です。
  • ASP.NET AJAX CTP
    AJAX Extensionsにまだ含まれていない開発中の機能です。この中には将来的にAJAX Extensionsに含まれる予定のコントロールや機能が詰まっています。これを利用する際にはAJAX Extensionsをインストールする必要があります。主な機能として、文字入力の補完を行うAutoCompleteExtenderコントロールや、コントロールのDragを可能にするDragOverlayExtenderコントロールなどがあります。
  • ASP.NET AJAX Control Toolkit
    AJAX Extensionsが使われているWebページ上で利用可能なAJAX機能を持ったコントロール群です。最終的には50個以上のコントロールが利用可能になります。また、自作のAJAXコントロールを作成するためのテンプレートをインストールすることも可能です。

 本稿では、ASP.NET AJAXの中でもサーバーサイド技術AJAX Extensionsにフォーカスし、開発を進める上で覚えておきたい知識を紹介します。なお、本稿を執筆する際に利用しているのはASP.NET AJAX RCになっています。正式版では仕様などが変更になる可能性がある点に注意してください。

対象読者

  • ASP.NET 2.0を使ったことがある人
  • AJAXに興味がある人
  • AJAXに興味があるが、JavaScriptが分からない人

必要な環境と準備

  • Visual Web Developer 2005 Express EditionもしくはVisual Studio 2005(以下、VS)
  • ASP.NET AJAX 1.0 RC(V1.0がリリースされている場合はそちらを使用してください)

 ASP.NET AJAXの入手は公式サイトにアクセスし、画面上部の[Download]という項目を選択します(図2)。

図2 ASP.NET AJAXサイトTop画面
図2 ASP.NET AJAXサイトTop画面

 選択後[ASP.NET AJAX 1.0 RC]を選択してダウンロード画面に移動します(図3)。

図3 ASP.NET AJAXサイトダウンロード画面
図3 ASP.NET AJAXサイトダウンロード画面

 ページ遷移後[Download]ボタンをクリックするとインストーラをダウンロードすることができます(図4)。

図4 ASP.NET AJAX 1.0 RC ダウンロード画面
図4 ASP.NET AJAX 1.0 RC ダウンロード画面

 ダウンロード後インストーラを実行すると、次のようにウィザードが起動します(図5)。

図5 Microsoft ASP.NET 2.0 AJAX Extensions Setupウィザード
図5 Microsoft ASP.NET 2.0 AJAX Extensions Setupウィザード

 後は、ウィザードの手順通りに進めていけばOKです。

ASP.NET 2.0 AJAX Extensions対応Webフォームの作成

 それではさっそく、具体的なサンプルを作成してみることにしましょう。VSを起動し、スタートページ上の[Webサイト]の作成を選択してください。次のような[新しいWebサイト]ダイアログが表示され、 AJAX Extensionsに対応したテンプレートが追加されていることが確認できるはずです(図6)。

図6 [新しいWebサイト]ダイアログ
図6 [新しいWebサイト]ダイアログ

 テンプレートに[ASP.NET AJAX-Enabled Web Site]を、言語に[Visual Basic]を選択した後、Webサイトを作成します。デフォルトで作成されたWebサイトの状態は、次の通りです(図7)。

図7 [ASP.NET AJAX-Enabled Web Site]を選択時のWebサイト
図7 [ASP.NET AJAX-Enabled Web Site]を選択時のWebサイト

 ここで、いくつか注目しておくべき点を挙げておきましょう。

  1. アプリケーション構成ファイル(Web.config)
    [ASP.NET AJAX-Enabled Web Site]テンプレートを選択した場合、Web.configとDefault.aspxファイル内の構成が他のテンプレートとは大きく異なっています。特にWeb.configにはASP.NET AJAXを利用するための設定が書かれています。例えばsystem.web要素には、複数の場所でMicrosoft.Web.Extensions(AJAX Extensionsのアセンブリ)という項目を確認できるはずです。他にもさまざまな場所でASP.NET AJAXのための設定が書かれているので、気になる方は、通常のWebサイトを作成した際に作られるWeb.configと見比べてください。
     
  2. ツールボックス
    インストーラからインストール中にAJAX ExtensionsのコントロールがGlobal Assembly Cashに登録され、VS上のツールボックスにAJAX Extensionsというカテゴリを自動生成し、コントロールが追加されます。各コントロールは次のような機能を持っています(図8)。
     
    図8 各コントロールの機能概要
    図8 各コントロールの機能概要

  • LINEで送る
  • このエントリーをはてなブックマークに追加

修正履歴

  • 2006/12/26 13:58 誤字修正:Page3 ソース部分 UpdateProgressコントロール→UpdateProgress

著者プロフィール

  • WINGSプロジェクト ナオキ(ナオキ)

    <WINGSプロジェクトについて> 有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂...

  • 山田 祥寛(ヤマダ ヨシヒロ)

    静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for ASP/ASP.NET。執筆コミュニティ「WINGSプロジェクト」代表。 主な著書に「入門シリーズ(サーバサイドAjax/XMLD...

All contents copyright © 2005-2018 Shoeisha Co., Ltd. All rights reserved. ver.1.5