今回からは，ASP.NET AJAXが提供する拡張サーバー・コントロールについて見ていくことにします。連載初回でも紹介したように，ASP.NET AJAXではAjaxアプリケーションを構築するにあたって典型的な機能を拡張サーバー・コントロールとして提供しています。これらサーバー・コントロールを利用することで，例えばページの一部分だけをリフレッシュしたい，一定時間おきに指定された処理を実行したい，などの決まりきった機能を，クライアントサイド・スクリプト（JavaScript）をほとんど意識することなく実装できます。

　ASP.NET AJAX β2版で提供されている拡張サーバー・コントロールは以下の通りです（表1）。

表1：ASP.NET AJAX β2版で利用可能な拡張サーバー・コントロール
名称概要
ScriptManagerAjax動作に必要なJavaScriptのコードを管理
ScriptManagerProxyAjax動作に必要なJavaScriptのコードを管理（マスターページ対応）
UpdatePanel部分的に更新可能な領域を定義
UpdateProgressコントロール非同期通信中に状態メッセージを表示
Timer指定時間おきに特定の処理を実行

このうち，ScriptManager（ScriptManagerProxy）コントロールは，すでにここまでの回でも紹介したとおりです。

UpdatePanelコントロールの基本

　それではさっそく，具体的なサンプルを見ていくことにしましょう。

　今回紹介するのはUpdatePanelコントロール。UpdatePanelコントロールは，その名の通り，（ページ全体ではなく）部分的に更新可能な領域を定義するためのコントロールです。

　本稿では，このUpdatePanelコントロールの内外にLiteralコントロールを一つずつ配置し，それぞれLiteralコントロール上に現在時刻を表示します。同じくUpdatePanelコントロール上に配置したButtonコントロール（［更新］ボタン）をクリックすると，UpdatePanelコントロール上に配置したLiteralコントロールだけが更新されることが確認できます（図1）。

図1：UpdatePanelコントロールを使ったサンプルアプリケーション
更新ボタンをクリックすると

UpdatePanelコントロール上のLiteralコントロールのみ更新される

　以下に，構築の手順を追っていきます。

1. ページ・レイアウトとプロパティの設定を行う

　ソリューションエクスプローラから新規の「.aspx」ファイルを作成し（ファイル名はUpdatePanel.aspxとしておきます），図2のようにコントロールを配置してください。

図2：UpdatePanel.aspxのフォームレイアウト

　また，それぞれのコントロールに対して，表2の要領でプロパティを設定しておきます。

表2：UpdatePanel.aspxのプロパティ設定
コントロールプロパティ設定値
ScriptManager(ID)manager
EnablePartialRenderingTrue
UpdatePanel(ID)upanel
Literal(ID)ltrUpdate
Text△（ブランク）
Button(ID)btnUpdate
Text更新
Literal(ID)ltrNoUpdate
Text△（ブランク）

　EnablePartialRenderingプロパティは，ページ内の「部分的な更新」を有効にするかどうかを指定します。UpdatePanelコントロールを使用する場合には，原則として，本プロパティをTrueに設定しておく必要があります＊1。

2. ページ・ロード時のコードを記述する

　次に，それぞれのLiteralコントロールに対して，ロード時に現在時刻を表示するコードを追加します。それぞれのLiteralコントロールを選択状態にしたうえで，プロパティウィンドウから（イベント）ボタン（図3）をクリックし，イベント一覧を表示，Loadイベントをダブルクリックしてください。コードエディタには，デフォルトで最低限のコードが自動生成されていますので，リスト1のようにコードを入力してみましょう（追記部分は太字）。

図3：イベントボタン　

リスト1：UpdatePanel.aspx 

<script runat="server">
Protected Sub ltrUpdate_Load(ByVal sender As Object, _
  ByVal e As System.EventArgs)
  ltrUpdate.Text = DateTime.Now.ToString()
End Sub


Protected Sub ltrNoUpdate_Load(ByVal sender As Object, _
  ByVal e As System.EventArgs)
  ltrNoUpdate.Text = DateTime.Now.ToString()
End Sub
</script>

　それぞれLiteralコントロールに対して現在の時刻を表示するだけのシンプルなコードです。［更新］ボタンによって，それぞれのコントロールが書き換えられた（リフレッシュされた）かどうかを確認するために，このようにロード時に最新の日時が表示されるようにしておきます。

　以上で，準備は完了です。UpdatePanel.aspxを実行し，ページ上の［更新］ボタンをクリックしてみましょう。本稿冒頭の図1のように，UpdatePanelコントロール上のコンテンツ（Literalコントロール）だけが表示されることが確認できれば成功です。

　今回記述したのは，あくまでUpdatePanelコントロールの動作を確認するためのダミーのコードだけですから，UpdatePanelコントロールを利用するだけならば完全にコーディングレスで機能を実装できることがおわかりになるはずです。

　☆　　　　　　　　　　　☆　　　　　　　　　　　☆　

　以上，今回はここまでです。次回は引き続き，UpdatePanelコントロールの応用的な使い方と，UpdateProgress/Timerコントロールについて紹介する予定です。

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