[#d37ae965]ASP.NETでAjaxを使ったWebアプリケーションを作成する方法を前々号から紹介してきました。前回はICallbackEventHandlerインターフェイスを実装する方法を紹介し、JavaScriptを全て自分で記述する方法と比べ、多少楽をすることができました。それでもやはりJavaScriptのコードを自分で書くことは必要で、JavaScriptの知識が必要でした。AJAX>http://asp.net/ajax/default.aspx]](開発コード名"Atlas")を使用すれば、極端に言えば、自分でJavaScriptのコードを一行も書くことなく、Ajaxを使用したページを作成することができます。自分でJavaScriptのコードを書かなければならない場合でも、大幅に簡略化できます。2.0に対応しています。AJAXのバージョンも1.0です。2.0がインストールされていることを確認してください。Site>http://www.asp.net/ajax/downloads/]]」からダウンロードできます。Extensionsだけで結構です。Extensionsをインストールした後にしてください。ダウンロードされたファイルは、"ASPAJAXExtSetup.msi"のようなファイル名になっているでしょう。このファイルをダブルクリックして、インストールを開始してください。インストールするには、管理者権限が必要です。AJAXがインストールされている場合は、アンインストールしてから新しいバージョンをインストールしてください。AJAX用のプロジェクトのテンプレートがインストールされます。Site」というテンプレートが見つかるはずです。Extensions」というタブが追加され、幾つかのコンポーネントが登録されます。AJAXを使用するには、Web.configに適切な設定が必要です。Site」を使ってプロジェクトを作成したときは、適切なWeb.configが用意されるため問題ありません。Extensions」タブにあるコントロールをページに配置したときに、Web.configに必要な設定が書き込まれるということになっていますが、これが完全ではないようです。Site」で作成されるWeb.configを参考にして、自分で記述しないとエラーが出るかもしれません。Studioをインストールしていない場合は、Web.configの設定をすべて自分で書き込む必要があります。AJAXをインストールしたフォルダにあります。Extensions\v1.0.61025\web.config」のようなパスで見つかるでしょう。AJAXを使ってみましょう。ここでは、前回、前々回と同様、ゆうパックの料金を調べるWebアプリケーションを作成します。Studioを使用した場合の手順は、次のようになります。Site」テンプレートを使用して、新しいWebサイトを作成します。Site」テンプレートを使わなかった場合は、Web.configを適当に書き換えてください。)+Default.aspxのデザインを開きます。ScriptManagerコントロールが一つ配置されていることを確認します。Extensions」タブからScriptManagerをページにドラッグ&ドロップして、配置します。ScriptManagerは必ず1つのページに1つだけ配置します。Extensions」タブからUpdatePanelをページにドラッグ&ドロップして、配置します。+前々号の「[[Ajaxを使用しない方法>../78#noajax]]」で紹介したのと全く同じ方法でコントロールの配置と設定をし、さらに、全く同じコードを記述します。コントロールは、すべてUpdatePanelコントロール内に配置します。具体的なコードは、次のようになります(ここでは、単一ページにしています)。</form></body></html>}}以上ですべて終了です。驚くことに、前々回紹介した、Ajaxを使用せずに、今までどおりポストバックを使用する方法と、ほとんど同じになります。コードは全く同じで、違いは、荷物のサイズを選択するDropDownListコントロールと、結果を表示するLabelコントロールがUpdatePanelコントロールの中(<ContentTemplate>の中)に入っていることだけです。自分でJavaScriptを書く必要も、Webサービスを作成する必要もありません。UpdatePanelコントロールを使うためには、ScriptManagerコントロールが必要です。UpdatePanelコントロールを使いたいページにScriptManagerコントロールが無ければ、まずScriptManagerコントロールを追加してから、UpdatePanelコントロールを追加します。ScriptManagerコントロールは、1つのページに1つだけ配置できます。補足:UpdatePanelコントロールの部分に出力されるHTMLは、<div>で囲まれた状態になります。[#pc5317bb]上記の例では全てのコントロールをUpdatePanelコントロール内に入れていましたが、基本的には、変化のある部分だけをUpdatePanelコントロール内に入れた方が良いです。変化のない部分をUpdatePanelコントロール内に入れてしまうと、サーバーは変化のない部分も含めた更新後のHTMLを送信するため、無駄が多くなり、効率的でありません。UpdatePanelコントロールの中身を更新するためのきっかけとなるコントロール(トリガー)をUpdatePanelの外に出したときは、UpdatePanelのTriggersプロパティにトリガーの情報を追加する必要があります。実際に上記のコードを改造してみましょう。+"Label1"と"PackageSizeList"をUpdatePanelの外に出します。+デザイナで"UpdatePanel1"を選択し、プロパティウィンドウの"Triggers"の右にある「...」ボタンをクリックして、「UpdatePanelTriggerコレクションエディタ」を表示します。+「追加」ボタンをクリックして、「メンバ」に「AsyncPostBack」を追加します。+「ControlID」プロパティを"PackageSizeList"とします。このUpdatePanelを更新するトリガーとなるコントロールに"PackageSizeList"ドロップダウンリストを指定します。+「EventName」プロパティを"SelectedIndexChanged"とします。SelectedIndexChangedイベントが発生した時にUpdatePanelが更新されるようにします。(この場合は、何も指定しなくても大丈夫です。)&ref(triggers.png,nolink,UpdatePanelTriggerコレクションエディタ);+「OK」ボタンをクリックします。この改造によって出来上がったコードは、次のようになります。[#jbc89610]このようにUpdatePanelは非常に簡単で、便利ですが、注意しなければならない点も多々あります。UpdatePanelの中に入れることのできないコントロールもあります。TreeView、Menu、WebParts、SubstitutionコントロールはUpdatePanelの中に入れて使うことができません。FileUpload、GridView、DetailsView、Login、PasswordRecovery、ChangePassword、CreateUserWizard、検証(Validation)コントロールは、制限付きでUpdatePanelの中に入れて使うことができます。Overview>http://asp.net/AJAX/Documentation/Live/overview/UpdatePanelOverview.aspx]]」をご覧ください。今回はこれでおしまいです。AJAXについて説明します。