次の方法で共有

ASP.NET Web ページのクライアント スクリプト

  • [アーティクル]

更新 : 2007 年 11 月

ASP.NET Web アプリケーションは、サーバー ベースのツールと言語に限定されるものではありません。ASP.NET Web ページに ECMAScript (JavaScript または JScript) を含めることで、ブラウザ ベースの豊富な機能を作成できます。ASP.NET には、クライアント スクリプトのサポート用の幅広い機能が用意されています。

独自のアプリケーション用に設計したブラウザの動作をサポートするには、選択肢の 1 つとして、クライアント スクリプトの個々のスニペットを作成し、ASP.NET Web ページに追加する方法があります。小さい JavaScript コードのみを含める場合、または既存の JavaScript コードを扱う場合は、この方法が実用的です。この方法は、ASP.NET Web ページのサイズを最小限に抑えるためにも役立ちます。

別の方法として、ASP.NET の強力な AJAX 機能を利用することもできます。このような AJAX 機能には、以下をサポートする完全なフレームワークも含まれています。

  • JavaScript によるオブジェクト指向プログラミング

  • 非同期ポストバック

  • 認証およびプロファイル用のアプリケーション Web サービス

  • クライアント スクリプトを管理し、デバッグとトレースの拡張サポートを提供するサーバー コントロール

ASP.NET AJAX 機能を使用すると、手動で多くのコードを記述する必要なく JavaScript 機能を活用できます。JavaScript の機能が拡張され、ASP.NET に統合されるクライアント機能を作成するためのフレームワークが提供されます。

ここでは、ASP.NET Web ページにクライアント スクリプトを追加するときのオプションの概要を説明します。このチュートリアルは、次のセクションで構成されています。

  • シナリオ

  • ASP.NET ページへのカスタム クライアント スクリプトの追加

  • ASP.NET AJAX 機能による JavaScript の拡張

  • クライアント スクリプトに依存する ASP.NET サーバー コントロール

  • ASP.NET サーバー コントロールへのクライアント スクリプト イベントの追加

  • クライアント スクリプトでのサーバー コントロールの参照

  • サーバー コントロールに対するクライアントのクリック イベントの発生

  • クライアント スクリプトとサーバー コード間の通信

  • クライアント スクリプト コンポーネントの作成

  • サーバー コントロールへのクライアント機能の追加

シナリオ

クライアント スクリプトは、次の操作を行う場合に使用します。

  • 機能が豊富で、ユーザーの操作への応答が良く、従来からのクライアント アプリケーションと同様に動作する Web ページを開発することにより、ユーザー エクスペリエンスを向上させるため。たとえば、テキスト ボックスに文字が入力されるたびにキーボード入力をチェックするために、クライアント スクリプトを使用できます。

  • ASP.NET Web ページに AJAX 機能を追加して、次のような処理を可能にするため。

    • ページで動的に DOM 要素を操作することにより、ページ全体を再表示する頻度を減らし、ページのちらつきを回避する。

    • サーバーへのポストバックを必要とせずにユーザー インターフェイス (UI: User Interface) を更新および管理する。

    • コードをクライアント コンポーネントに編成する。クライアント コンポーネントは、Microsoft AJAX Library に基づく JavaScript をカプセル化する、再利用可能なオブジェクトです。クライアント コンポーネントは、カスタムのサーバー側コントロールで管理することも、既存のサーバー コントロールと関連付けてクライアント機能を追加することもできます。

ASP.NET ページへのカスタム クライアント スクリプトの追加

ASP.NET Web ページは HTML マークアップをレンダリングするだけなので、独自のクライアント スクリプトを ASP.NET ページに追加できます。ASP.NET ページは、ページを要求するブラウザがクライアント スクリプトをサポートする範囲でクライアント スクリプトをサポートします。携帯電話などのデバイスのブラウザでページが実行されている場合、クライアント スクリプトのサポートの範囲はブラウザによって異なります。

ASP.NET ページにクライアント スクリプトを含めるには、いくつかの方法があります。

  • script ブロックに静的にクライアント スクリプトを追加できます。このブロックにコードを含めるか、このブロックで include 属性を使用して JavaScript (.js) ファイルを参照します。この方法は、動的に作成する必要がなく、Microsoft AJAX Library で提供される追加の AJAX 機能も必要としないクライアント スクリプトを含むスクリプト ブロックまたは JavaScript ファイルを挿入する場合に使用します。

  • ClientScriptManager クラスを使用して、動的にクライアント スクリプトを作成し、ASP.NET Web ページに追加できます。この方法は、実行時にのみ利用できる情報に依存するスクリプトを作成する場合に使用します。

  • ASP.NET の AJAX 機能を利用することを予定している場合は、ScriptManager サーバー コントロールを使用してクライアント スクリプト ファイルを管理できます。ScriptManager サーバー コントロールを使用することで、スクリプトが実行される前に、確実にブラウザに Microsoft AJAX Library が読み込まれるようにもできます。詳細については、「ASP.NET AJAX の概要」を参照してください。

静的なクライアント スクリプト ブロックの追加

HTML ページと同様に、ASP.NET ページに script ブロックを追加できます。クライアント スクリプトを使用すると、ページの onload イベントなどのクライアント イベントのハンドラを記述できます。ASP.NET ページがブラウザで実行されているときは、クライアント スクリプトでページのマークアップ要素をアドレス指定できます。それらは、HTML ページで発生するすべてのクライアント イベントを発生させます。

3hc29e2a.alert_note(ja-jp,VS.90).gifメモ :

クライアント スクリプトでは、ASP.NET サーバー コントロールを参照できます。詳細については、後で説明する「クライアント スクリプトでのサーバー コントロールの参照」を参照してください。

ASP.NET Web ページでは、次の例のように、<script> タグの src 属性でスクリプト ファイルを参照することにより、スクリプト ファイルにもアクセスできます。

<script type="text/javascript" src="MyScript.js"></script>

クライアント スクリプトをページ自体に含めるのではなく、外部の .js ファイルとして保持すると、クライアント スクリプトの整理に役立ちます。これにより、バージョン管理およびページ間での共有も簡単になります。

外部の .js ファイルは、Web ページやイメージがキャッシュされるのと同じように、ブラウザによってキャッシュされます。スクリプトが外部ファイルとして読み込まれると、それを必要とする他の任意の Web ページでキャッシュ内のスクリプトを使用できるようになります。これは、Web アプリケーションのパフォーマンスの向上につながる可能性があります。

クライアント スクリプトの動的な作成

多くの場合、クライアント スクリプトは、ページのスクリプト ブロックとして宣言して作成できます。ただし、クライアント スクリプトを動的に作成することもできます。これは、実行時にのみ使用できる情報にスクリプトが依存している場合に便利です。たとえば、アプリケーションが実行されるまで名前 (ID) がわからないサーバー コントロールを処理するクライアント スクリプトをページに挿入したり、ユーザーから取得する値に依存するスクリプトを作成したりできます。

次のような ClientScriptManager クラスのメソッドを呼び出すことで、動的にクライアント スクリプトを作成し、表示ページに挿入できます。

動的に生成されたクライアント スクリプトをページに追加する方法を次の例に示します。このコードでは、checkDisplayCount という名前のチェック ボックスがオンになっているかどうかを調べます。オンの場合は、次のタスクを実行します。

  • span 要素を使用して TextBox1 という名前の TextBox コントロールに文字数を表示するスクリプト関数を作成します。

  • TextBox コントロールにクライアント イベントを追加します。

  • span 要素を生成します。

このコードでは、ページに checkDisplayCount という名前のチェック ボックスがあり、その AutoPostBack プロパティが true に設定されていること、および PlaceHolder1 という名前の PlaceHolder コントロールがあることを前提としています。

Protected Sub Page_Load(ByVal sender As Object, _
        ByVal e As System.EventArgs)
    If checkDisplayCount.Checked Then
        Dim scriptText As String = ""
        scriptText &= "function DisplayCharCount(){"
        scriptText &= "   getElementByID("spanCounter").innerText = " & _
            "document.forms[0].TextBox1.value.length"
        scriptText &= "}"
        ClientScriptManager.RegisterClientScriptBlock(Me.GetType(), _
            "CounterScript", scriptText, True)
        TextBox1.Attributes.Add("onkeyup", "DisplayCharCount()")
        Dim spanLiteral As New LiteralControl()
        spanLiteral.Text = "<span id=""spanCounter""></span>"
        PlaceHolder1.Controls.Add(spanLiteral)
    End If
End Sub

void Page_Load(object sender, EventArgs e)
{
    if(checkDisplayCount.Checked)
    {
        String scriptText = "";
        scriptText += "function DisplayCharCount(){";
        scriptText += "   spanCounter.innerText = " + 
            " document.forms[0].TextBox1.value.length";
        scriptText += "}";
        ClientScriptManager.RegisterClientScriptBlock(this.GetType(), 
           "CounterScript", scriptText, true);
        TextBox1.Attributes.Add("onkeyup", "DisplayCharCount()");
        LiteralControl spanLiteral = new 
            LiteralControl("<span id=\"spanCounter\"></span>");
        PlaceHolder1.Controls.Add(spanLiteral);
    }
}

詳細については、「方法 : ASP.NET Web ページにクライアント スクリプトを動的に追加する」を参照してください。

ClientScriptManager クラス メソッドでは、スクリプト ブロックが関連付けられている型を指定し、スクリプト ブロックにキーを付与します。型を指定することによって、ページとコントロール (カスタム コントロールまたはユーザー コントロール) の両方がスクリプト ブロックを同じページに追加する場合の衝突を回避できます。キーを使用することによって、重複を回避できます。いずれかのメソッドを呼び出してスクリプトを追加する場合、同じキーと同じ型を持つスクリプトが既に存在すると、スクリプトは追加されません。

指定した型とキーは、不要な重複を避けるために役立ちます。このため、通常、スクリプト ブロックが既に存在するかどうかを明示的に判別する必要はありません。ただし、アプリケーションで既存のスクリプト ブロックの存在を確認する必要がある場合は、次のメソッドを呼び出します。

ScriptManager コントロールの使用によるクライアント スクリプトの追加

ASP.NET の AJAX 機能を使用する場合は、ScriptManager コントロールによって、ページにスクリプト ファイルを追加する方法が用意されています。これには、ディスク上の静的なスクリプト ファイル (.js ファイル) と、アセンブリ内にリソースとして埋め込まれるスクリプト ファイルがあります。コントロール内で宣言を使用してスクリプト ファイルを指定できます。別の方法として、ScriptManager コントロールの登録メソッドを使用することにより、既存のクライアント スクリプト ファイルをプログラムで管理し、スクリプトを操作して部分ページ更新をサポートすることもできます。

ScriptManager コントロールの概要については、「ScriptManager コントロールの概要」を参照してください。アセンブリ内のリソースとして JavaScript ファイルを埋め込む方法、およびそれを Web ページで使用する方法の詳細については、「チュートリアル : アセンブリ内のリソースとしての JavaScript ファイルの埋め込み」を参照してください。

3hc29e2a.alert_note(ja-jp,VS.90).gifメモ :

ASP.NET のクライアント AJAX 機能のみを使用し、サーバー ベースの機能を使用しない場合は、ClientScriptManager クラスのメソッドを使用して ASP.NET Web ページにスクリプトを挿入します。たとえば、スクリプトで UpdatePanel コントロールやローカリゼーション機能を使用しない場合、ScriptManager コントロールは必要ありません。したがって、そのメソッドを呼び出してページにクライアント スクリプトを挿入することはできません。通常、ClientScriptManager クラスのメソッドを使用する方が、ScriptManager コントロール メソッドを使用するよりも効率的です。これは、ClientScriptManager クラスのメソッドでは、ScriptManager コントロールでサポートされるサーバー ベースの機能のための余分な処理が不要になるためです。単に既存のスクリプトを管理するのではなく、動的にスクリプトを作成する必要がある場合は、ClientScriptManager クラスを使用してクライアント スクリプトをページに挿入します。たとえば、既存のスクリプト ファイルでは参照できない情報に基づいて、プログラムによってクライアント スクリプトを作成するには、ClientScriptManager クラスを使用します。

ASP.NET AJAX 機能による JavaScript の拡張

ASP.NET では AJAX 機能がサポートされており、ASP.NET Web ページに豊富な機能を追加するクライアント スクリプトを使用できます。これには、非常に応答性の高い UI である非同期ポストバックなどが含まれます。AJAX 機能は、Microsoft AJAX Library を使用して実装されます。このライブラリは、ブラウザ間で動作する ECMAScript (JavaScript) テクノロジおよびダイナミック HTML (DHTML) テクノロジが組み込まれたクライアント スクリプト ライブラリから構成されています。AJAX 機能は、ASP.NET のサーバー ベースの開発プラットフォームに統合されています。

Microsoft AJAX Library の型システム、オブジェクト指向機能、および JavaScript オブジェクトに対する拡張を使用すると、カスタム クライアント スクリプトを作成するための次の機能が提供されます。

  • 名前空間

  • 継承

  • インターフェイス

  • 列挙体

  • リフレクション

  • デバッグ ヘルパー

  • トレース

  • 型指定された例外処理

  • 文字列および配列用のヘルパー メソッド

    3hc29e2a.alert_note(ja-jp,VS.90).gifメモ :

    Microsoft AJAX Library は、ASP.NET のサーバー ベースの AJAX 機能を使用する予定がなくても使用できます。

Microsoft AJAX Library によってどのように JavaScript が拡張されるかの詳細については、次のトピックを参照してください。

AJAX 機能のブラウザの互換性

Microsoft AJAX Library のブラウザ互換性レイヤによって、最も頻繁に使用されるブラウザ (Microsoft Internet Explorer、Mozilla Firefox、Apple Safari など) に対して AJAX スクリプトの互換性が提供されます。このため、サポート対象であれば、どのブラウザに対しても同じスクリプトを記述できます。詳細については、「ASP.NET AJAX の概要」を参照してください。

クライアント スクリプトに依存する ASP.NET サーバー コントロール

一部の ASP.NET サーバー コントロールでは、クライアント スクリプトを使ってその機能を実現しています。たとえば、LinkButton コントロールは、ポストバック機能をサポートするためにクライアント スクリプトを必要とします。ASP.NET Web サーバー コントロールに必要なクライアント スクリプトは、ページがレンダリングされるときに自動的にページに追加されます。このようなコントロールのために生成されるクライアント スクリプトは、ユーザーが作成するクライアント スクリプトから独立しています。

詳細については、「クライアント スクリプトを使用する ASP.NET Web サーバー コントロール」を参照してください。

ASP.NET サーバー コントロールへのクライアント スクリプト イベントの追加

ASP.NET コントロールは、ページ内の要素としてレンダリングされます (コントロールによってレンダリングされる厳密な要素は、HTML や XHTML などのページのマークアップ言語に依存します)。したがって、クライアント スクリプトのイベント処理は、ページの要素と同様にコントロールに追加できます。ただし、場合によっては、コントロールの出力がレンダリングされる方法や、コントロールが自身のために予約している属性を理解している必要があります。

詳細については、「方法 : ASP.NET Web サーバー コントロールにクライアント スクリプト イベントを追加する」を参照してください。

宣言によるクライアント イベント ハンドラの追加

ASP.NET サーバー コントロールのマークアップでは、属性を使用してプロパティ値を設定します。たとえば、TextBox コントロールの Text プロパティを設定するには、次のようなマークアップを作成できます。

<asp:textbox id="TextBox1" runat="server" text="Sample Text" />
3hc29e2a.alert_security(ja-jp,VS.90).gifセキュリティに関するメモ :

TextBox はユーザー入力を受け入れるため、セキュリティ上の脅威になる可能性があります。既定では、ASP.NET Web ページは、ユーザー入力にスクリプトまたは HTML 要素が含まれていないことを検証します。詳細については、「スクリプトによる攻略の概要」を参照してください。

コントロールのプロパティにマップされない属性を含めると、サーバーの処理中、ASP.NET はこの属性を無視します。その属性は、コントロールによって生成されたマークアップの一部として、そのままブラウザに渡されます。たとえば、TextBox コントロールに onkeyup というプロパティはありません。したがって、TextBox コントロールのマークアップに onkeyup 属性を含めると、その属性はそのままブラウザに渡されます。この動作により、イベントのバインディングをマークアップで宣言することで、それらをサーバー コントロールに追加できます。たとえば、次の TextBox コントロールのマークアップでは、spanCounter という span 要素によって、ユーザーがテキスト ボックスに入力するたびに、テキスト ボックスに現在のテキストの長さが表示されます。

<asp:textbox id="TextBox1" runat="server" text="Sample Text" 
  onkeyup="spanCounter.innerText=this.value.length;" />

このイベントで、ページの他の場所にあるクライアント スクリプトで定義されているメソッドを呼び出すこともできます。

<asp:textbox id="TextBox1" runat="server" text="Sample Text" 
  onkeyup="DisplayCount(this);" />

サーバー コードに使用する言語 (Visual Basic または C#) は、クライアント スクリプトには影響しません。クライアント スクリプトは、常に ECMAScript (JavaScript または JScript) で記述されます。

詳細については、「方法 : ASP.NET Web サーバー コントロールにクライアント スクリプト イベントを追加する」を参照してください。

サーバー コードでの属性の追加

宣言によってパススルー属性をコントロールに追加するだけでなく、サーバー コードを使用してプログラムによって属性を追加することもできます。この方法は、追加する属性の値が実行時にしかわからない場合に便利です。詳細については、「方法 : ASP.NET Web ページのコントロールの HTML 属性を設定する」を参照してください。

クライアント スクリプトでのサーバー コントロールの参照

ASP.NET サーバー コントロールがレンダリングされるときには、コントロールの ClientID プロパティが、結果として生成される要素の id 属性および name 属性としてページにレンダリングされます。ClientID プロパティは、設定される ID プロパティから自動的に生成されます。たとえば、次のような ASP.NET サーバー コントロールを作成するとします。

<asp:textbox id="TextBox1" runat="server" text="Sample Text" />

ClientID プロパティは TextBox1 に設定されているので、HTML ベースのブラウザで生成される要素は次のようになります。

<input name="TextBox1" type="text" value="Sample Text" id="TextBox1" />
3hc29e2a.alert_note(ja-jp,VS.90).gifメモ :

form 要素は、name 属性ではなく ID 属性のみにレンダリングされます。

したがって、これらの属性を使用すると、クライアント スクリプトでサーバー コントロールを参照できます。通常、コントロールをアドレス指定するには、クライアント スクリプト内で完全に修飾された参照を使用します。コントロールがページの form 要素の子である場合は、一般に、次の例に示すような構文を使用してクライアント スクリプトのコントロールを参照します。

var tb1 = document.getElementById("TextBox1");
tb1.value = "New value";

次の例では、ページの form 要素の id 属性が form1 に設定されていることを前提にしています。

document.form1.TextBox1.value = "New value";

サーバー コントロールを参照するのに必要な正確な構文は、使用するコントロールおよびそのコントロールが別のコントロールの子になっているかどうかに依存します。コントロールを参照する方法に確信がない場合は、ページを実行し、ソースを表示し、コントロールがどのようにレンダリングされているかを確認してみます。

他のコントロール内でレンダリングされたコントロールの参照

子コントロールをページにレンダリングするコントロールもあります。これには、ListView、GridView、DetailsView、FormView、DataList、Repeater の各コントロールなどのデータ リスト コントロール、ユーザー コントロール、Web パーツ コントロールなどが含まれます。

この場合、子コントロールが一意の ID を持つとは限りません。この理由として考えられるのは、各データ行 (データ リスト コントロール) に対して新しいコントロール インスタンスを生成するテンプレートで、子コントロールが定義される場合です。または、親コントロールが外部ソース (ユーザー コントロールや Web パーツ コントロール) からページに追加されるためである場合もあります。つまり、このような親コントロールは名前付けコンテナです (INamingContainer を実装します)。名前付けコンテナによって、子コントロールがページ内で一意の ID を確実に持つことになります。

たとえば、DataList コントロール内に ItemTemplate プロパティを作成するとします。テンプレートで、ID を checkEnabled に設定した CheckBox コントロールを追加します。DataList コントロールをレンダリングすると、各項目に対して新しい checkEnabled コントロールがレンダリングされます。表示されるページには、checkEnabled という名前の要素の複数のインスタンスを含めることはできません。このため、DataList コントロールは、子コントロールごとに一意の ID を作成します。

名前付けコンテナの子コントロールの一意の ID は、2 つのプロパティのレンダリングによって生成されます。各子コントロールに対して、次のようにレンダリングされます。

  • コントロールの UniqueID プロパティは name 属性としてレンダリングされます。

  • コントロールの ClientID プロパティは id 属性としてレンダリングされます。

ClientID プロパティと UniqueID プロパティの両方が、元の ID プロパティに基づき、ページ内で一意になるために必要な情報を追加して修正されます。ClientID の値 (レンダリングされた要素の id 属性) は、クライアント スクリプトで参照できます。

名前付けコンテナを含むページをブラウザに表示した場合は、ページのソースを参照することで、名前付けコンテナの子コントロールの name 属性および id 属性として生成された一意の ID を確認できます。ただし、ブラウザで確認した ID は直接使用しないようにお勧めします。子コントロールに対して一意の ID を生成する式は変更されることがあります。代わりに、サーバー コードで子コントロールの ClientID プロパティの値を取得し、その値を使用して子コントロールを参照します。たとえば、ページ内に動的にクライアント スクリプトを作成する場合があります。クライアント スクリプトが子コントロールを参照する場合は、子コントロールの ClientID プロパティを取得して動的なスクリプトに組み込みます。

サーバー コントロールに対するクライアントのクリック イベントの発生

前に説明したとおり、コントロールのマークアップに onclick 属性を追加することにより、ほとんどの ASP.NET サーバー コントロールにクライアントのクリック イベントを追加できます。ただし、一部のコントロールはサーバー イベントへのバインディングを定義するために onclick 属性を予約しています。たとえば、Button、LinkButton、および ImageButton の各コントロールなどです。このようなコントロールでは、onclick 属性を宣言してコントロールにクライアント スクリプト ハンドラを追加できません。

クリック イベントのクライアント スクリプト ハンドラは、次の 2 つの方法を使用して追加できます。

  • 実行するスクリプトにコントロールの OnClientClick プロパティを設定します。ボタン コントロールがレンダリングされると、OnClientClick 値が onclick 属性に変化します。

  • コントロールの Attributes コレクションの Add メソッドをプログラムで呼び出して、 onclick 属性を追加します。

    3hc29e2a.alert_note(ja-jp,VS.90).gifメモ :

    LinkButton のように、サーバー コントロールが既に onclick を基本的な機能の一部として使用している場合、プログラムによってそのコントロールに onclick 属性を追加することはできません。

クライアント側およびサーバー側の両方で Click イベントを生成する Button コントロールのコード例を次に示します。

<asp:button id="Button1" 
  runat="server" 
  OnClientClick="return confirm('Ok to post?')" 
  onclick="Button1_Click" 
  Text="Click!" />

クライアント スクリプトとサーバー コード間の通信

ASP.NET Web ページでは、標準的なポストバックを使用する以外に、クライアント スクリプトとサーバー コード間の通信をいくつかの方法で行うことができます。UpdatePanel サーバー コントロールなどの ASP.NET の AJAX 機能を使用すると、非同期の部分ページ更新を自動化できます。さらに、ASP.NET AJAX では、Web サービスの非同期呼び出しもサポートされています。

ASP.NET の AJAX 機能を使用しない場合は、カスタム クライアント コールバックを直接呼び出し、さまざまな方法でブラウザとサーバー間で情報を共有できます。次のセクションでは、使用できるオプションについて説明します。

クライアント スクリプトからのサーバー コードの直接呼び出し

クライアント コールバックを実装すると、クライアント スクリプトでサーバー コードを直接呼び出すことができます。ASP.NET Web ページでよくあるシーケンスでは、サーバー コードを実行する各ユーザー アクションにポストバックが必要です。ただし、完全なポストバックなしにブラウザからサーバー処理を起動することもできます。この場合、ブラウザからページ全体がサーバーに送信されるのではなく、サーバーの応答時にページが再読み込みされるわけでもありません。代わりに、ブラウザは少量のデータをサーバーに送信します。サーバーが応答を送信すると、ブラウザのクライアント スクリプトは、ページの再読み込みを行わずに返されたデータを処理します。サーバーの処理中には、ローカル変数などのクライアント状態がすべて保持されます。この処理は非同期ポストバックと呼ばれ、部分ページ レンダリングの中核となるものです。

次の方法により、ポストバックなしでクライアント スクリプトからサーバー コードを呼び出すことができます。

  • ASP.NET の UpdatePanel サーバー コントロールを使用します。このコントロールは、ASP.NET の AJAX 機能の一部です。これを使用すると、部分ページ更新で再表示するページの領域を定義できます。UpdatePanel コントロールを使用する場合、非同期で部分ページ更新を実行するために自分でクライアント スクリプトを記述する必要はありません。詳細については、「部分ページ レンダリングの概要」および「UpdatePanel コントロールの概要」を参照してください。

  • Web サービス通信用の ASP.NET AJAX サポートを使用して、Web サーバー メソッドを呼び出すクライアント スクリプトを記述します。この方法は、概念のうえでは、独自のクライアント スクリプト コールバックを記述して Web サーバー メソッドを呼び出す方法と似ています。ただし、Microsoft AJAX Library では、サーバー メソッドの呼び出しの詳細を扱うことができ、呼び出しを作成および処理するために、より信頼性の高いクライアント スクリプト ライブラリが提供されます。詳細については、「ASP.NET AJAX での Web サービス」を参照してください。

  • クライアント コールバックを実装します。この場合、要求を送信するクライアント コードおよび結果を処理するクライアント コードを記述します。一般的な方法は、呼び出し元の関数およびサーバーが結果を返したときに呼び出されるコールバック関数をクライアント スクリプトに作成することです。詳細については、「ASP.NET Web ページでポストバックせずにプログラムによってクライアント コールバックを実装する」を参照してください。

それぞれの方法に利点があります。独自のクライアント コールバックの作成は、多くの場合、最も負荷が少なく、ページ サイズも最小にできる方法です。UpdatePanel サーバー コントロールを使用すると、クライアント スクリプトを自分で記述することなく、部分ページ更新を実装できます。AJAX を使用して Web サービスを呼び出す場合も、Web サービスを非同期に呼び出すためのクライアント スクリプトをほとんど記述せずに済みます。

HiddenField コントロールによるデータの共有

ページに HiddenField コントロールを追加することにより、クライアント スクリプトとサーバー コード間で情報を共有できます。クライアント スクリプトでは、ID によって隠しフィールドを参照できます。サーバー コードでも隠しフィールドを参照できます。これにより、一方のコード ブロックで値を格納し、それを別のコード ブロックで読み取ることができます。サーバー コードからクライアント スクリプトに情報を渡すには、プログラムで RegisterHiddenField メソッドを使用して隠しフィールドを作成します。このメソッドでは、フィールドの ID と値を指定します。このフィールドを使用すると、クライアント スクリプトが読み取ることができる形でページ内の動的な値を格納できます。

Cookie を使用することでも、サーバー コードとクライアント コード間で値を共有できます。サーバー コードでの Cookie の読み取り方法と書き込み方法の詳細については、「方法 : Cookie を記述する」および「方法 : Cookie を読み取る」を参照してください。JavaScript を使用して Cookie を読み取る方法と書き込む方法の詳細については、MSDN Web サイトの「JavaScript and cookies」を参照してください。

非同期ポストバック中のデータの共有

ASP.NET の AJAX 機能を使用している場合は、RegisterDataItem メソッドを使用することにより、非同期ポストバック (部分ページ レンダリング) 中にサーバーからクライアントにカスタム データを文字列として送信できます。RegisterDataItem メソッドでは、サーバー コードを使用して、コントロールに関連付けるフィールドを登録できます。ブラウザ内のクライアント スクリプトでは、ASP.NET AJAX の Sys.WebForms.PageLoadingEventArgs、Sys.WebForms.PageLoadedEventArgs、および Sys.WebForms.PageLoadedEventArgs の各オブジェクトを通じてフィールド値にアクセスできます。RegisterDataItem メソッドは、非同期ポストバック中にのみ呼び出すことができます。

RegisterDataItem メソッドを使用してサーバーとクライアント間でデータを共有する方法の詳細については、次のトピックを参照してください。

クライアント スクリプト コンポーネントの作成

クライアント コンポーネントは、Microsoft AJAX Library に基づく JavaScript をカプセル化する、再利用可能なオブジェクトです。このライブラリには、基本クライアント オブジェクト型のクラスとして、Component (非ビジュアル コンポーネントの基本クラス)、Control、および Behavior の各クラスが用意されています。これらのクラスから、次のような豊富なクライアント機能を派生させることができます。

  • 初期化から破棄まで、その有効期間にわたってコンポーネントにアクセスできるようにします。これには、プロパティ値が変更されたときに発生するイベントなどが含まれます。

  • 新しい機能を持つクライアント オブジェクトとして DOM 要素を表します。これにより、DOM 要素の動作が拡張されます。たとえば、既存のテキスト ボックスに関連付けることができる透かしの動作を追加できます。

詳細については、次のトピックを参照してください。

サーバー コントロールへのクライアント機能の追加

既存またはカスタムの ASP.NET サーバー コントロールはすべて、ASP.NET AJAX のエクステンダ コントロールに変換できます。エクステンダ コントロールとは、Web ブラウザの ECMAScript (JavaScript)、DHTML、および AJAX 機能を使用して、サーバーとの対話や非同期通信などの機能を追加する Web サーバー コントロールです。

詳細については、次のトピックを参照してください。

参照

概念

ASP.NET Web サーバー コントロールとブラウザの機能

ASP.NET Web サーバー コントロールのイベント モデル