Share via


サンプルから体験するASP.NET AJAX (1)

 こんにちは。記念すべきWindows Vista, the 2007 Office systemの発売日に高熱にうなされ(><)イベントを堪能できなかった長沢です。

 ASP.NET AJAX 1.0 がリリースされすでに数日経過していますので、実際にダウンロードし、お試しいただいた方々も多くいらっしゃるのではないでしょうか。

 https://ajax.asp.net サイトには、ASP.NET AJAX Extensions 1.0の他にも多くの有益なリソースが入手できるようになっています。簡単に列挙すると

  • ASP.NET AJAX Extensions 1.0
  • ASP.NET AJAX Control Toolkit
  • ASP.NET AJAX Futures January CTP
  • ASP.NET AJAX Extensions 1.0 Source Code (1/30より提供開始です)
  • Sample Applications 
  • Microsoft AJAX Library

とあります。今回は、上記のSample Applicationsの内容を見ることでASP.NET AJAXの世界を覗いてみたいと思います。

 なお、Samplesをインストールする以前のASP.NET AJAX環境の構築については松崎剛のブログASP.NET AJAX 1.0 の世界 【第1回 事前準備】をご覧いただくことで簡単に実施していただくことができます(記事掲載時と正式版リリースで各名称が若干異なっていますが、判別いただけると思います)。

 さて、Sample Applications(ASPAJAXSamples.msi)をインストールしていただくと、InstallationInstructions.txtに記載されていますが、まずは、3つあるサンプルアプリケーション(Contacts, SimpleList, TaskList)のbinフォルダに以下の2つのDLLファイルをコピーしてください。

  • Microsoft.Web.Preview.dll:
    Futures CTPをインストールしたフォルダの下のバージョン番号(現在だとv1.0.61025)にあります
  • AjaxControlToolkit.dll:
    Control Toolkitをインストールしたフォルダの下(例えばSampleWebSiteのBin)にあります

 ここまで完了しましたら、いよいよVisual Studio(または、Visual Web Developer)を起動します。[ファイル(F)|新規作成(N)|Webサイト(W)...]にてContactsサンプルプロジェクトを作成しましょう。テンプレートから「空のWebサイト」を選択し、場所として、Sample Applicationsインストールフォルダ下のContactsフォルダを指定し、言語を「Visual C#」にしましょう。「Webサイトは、既に存在します。」言われますので、「既存のWebサイトを開く(O)」を選択してください。

 Contactsプロジェクトには、4つのそれぞれ独立したWebページとデータベース、Webサービスが1つずつといった構成になっています。独立した4つのページは、データベースからデータを取り出し表示や更新を行うものなのですが、それぞれに以下の特徴があります。

  • 0_Default.aspx
    AJAXコントロールを使っていないページ
  • 1_Default_UpdatePanels.aspx
    UpdatePanelコントロールのみを使っているページ
  • 2_Default_AutoCompleate.aspx
    AutoCompleteコントロールを使っているページ(Locationの候補をWebサービスから取得しています)
  • 3_Default_DragAndDrop.aspx
    上記および、Drag&Dropコントロールを使っているページ(ドラッグ&ドロップでレコード追加のパネルを移動できます:-))

それぞれが独立したページになっていますので、とりあえず、
各ページを選択し、右クリックして、[ブラウザで表示(B)]してみましょう。

どのページも同じデザインのものが表示されたと思います(^^Screen Shot

見た目は同じですが、持っているユーザビリティは異なっています。次回(明日、目標)は、違いについて表示されたWebページとソースで見て行きたいと思います。 

ながさわ

Comments

  • Anonymous
    January 31, 2007
    こんにちは。 前回 に引き続き、サンプルを使ってASP.NET AJAXの魅力を見ていきましょう。 0_Default.aspx: このページは、ASP.NET AJAXのコントロールを一切使っていません。まずは、レコードの編集をしてみましょう。ContactID:40

  • Anonymous
    February 07, 2007
    (1) 、 (2) では、Sample Applications の Contact を見てみました。今回は、 SimpleList を見てみたいと思います。 Visual Studio 2005 での開き方は、