Button Web サーバー コントロールの概要

Visual Studio 2010

更新 : 2007 年 11 月

ASP.NET Button Web サーバー コントロールを使用すると、ユーザーはページをサーバーにポストし、ページでイベントを発生させることができます。

このトピックの内容は次のとおりです。

Button Web サーバー コントロールを使用すると、ユーザーがサーバーにページをポストできるようになります。このコントロールは、サーバー コードにイベントを発生させます。このイベントを処理することにより、ポストバックに応答できます。たとえば、ユーザーはフォームへの入力を完了していること、または特定のコマンドを実行することを示すことができます。

ASP.NET には 3 種類のボタン コントロールがあり、次の表に示すように、それぞれ異なる形式で Web ページに表示されます。

コントロール

説明

Button

HTML input 要素として表示される標準のコマンド ボタンを表します。

LinkButton

ページにハイパーリンクを表示します。ただし、このボタンには、フォームをサーバーに送り返すためのクライアント側スクリプトが格納されているだけです(HyperLink Web サーバー コントロールを使用することで真のハイパーリンクを作成できます)。

ImageButton

グラフィックをボタンとしてレンダリングします。多彩な外観のボタンを作成する場合に使用すると便利です。ImageButton コントロールは、グラフィック内のクリックされた位置を示す座標についての情報も提供します。

HtmlButton コントロールと HtmlInputButton コントロールを使用して、サーバー側コードから操作できるボタンをページに作成することもできます。HTML サーバー コントロールと Web サーバー コントロールとの違いの詳細については、「ASP.NET Web サーバー コントロールの概要」を参照してください。

ImageMap コントロールを使用すると、ホットスポットのあるグラフィックを作成できます。ユーザーはホットスポットをクリックすることにより、ポストバックまたは他のアクションを実行できます。

Button イベント

ユーザーが Web サーバー コントロール ボタンをクリックすると、サーバーにページが送信されます。サーバーにフォームが送信されると、Web ページが処理され、サーバー側コードで保留中のイベントが発生します。ボタン独自の Click イベントを発生させて、ユーザーが作成したイベント ハンドラで処理することもできます。

ボタン コントロールと検証

ページに ASP.NET 検証コントロールが含まれる場合、ボタン コントロールをクリックすると、既定で、検証コントロールによって検証が実行されます。検証コントロールでクライアント側の検証が有効にされていると、検証チェックが失敗した場合ページは送信されません。

ボタン コントロールでサポートされている、検証プロセスをより正確に制御できるようにするプロパティについて次の表で説明します。

プロパティ

説明

CausesValidation

ボタンのクリックで検証チェックも実行されるかどうかを指定します。検証チェックを実行しないようにするには、このプロパティを false に設定します。

ValidationGroup

ボタンのクリック時にページ上のどの検証コントロールが呼び出されるかを指定できるようにします。検証グループが作成されていない場合、ボタンをクリックすると、ページ上にあるすべての検証コントロールが呼び出されます。

詳細については、「ASP.NET Web ページにおけるユーザー入力の検証」を参照してください。

ボタン ポストバックの動作

ユーザーがボタン コントロールをクリックすると、ページがサーバーにポストバックされます。既定では、ページはそのページ自身にポストバックされます。同じページが再生成され、ページ上のコントロールのイベント ハンドラが処理されます。

現在のページを別のページにポストするようにボタンを設定できます。これは、マルチページ フォームの作成に便利です。詳細については、「ASP.NET Web ページにおけるページ間ポスティング」を参照してください。

既定では、Button コントロールは HTML POST 操作を使用することでページを送信します。LinkButton コントロールと ImageButton コントロールは、HTML POST 操作を直接サポートすることはできません。そのため、これらのボタンを使用すると、コントロールがページをプログラムによって送信できるクライアント スクリプトがページに追加されます(したがって、LinkButton コントロールと ImageButton コントロールでは、ブラウザでクライアント スクリプトが有効になっている必要があります)。

Button コントロールでポストバックを実行するクライアント スクリプトも使用する必要がある場合もあります。これは、ページ上の他の要素へのポストバックの関連付けなど、ポストバックをプログラムで操作する必要がある場合に便利です。Button コントロールの UseSubmitBehavior プロパティを true に設定することで、Button コントロールがクライアント スクリプト ベースのポストバックを使用するように指定できます。

UpdatePanel コントロールでのボタンの使用

部分ページ レンダリングでは、ポストバックなしでページの一部を更新できます。UpdatePanel コントロールを使用すると、部分ページ レンダリングに含まれる部分的なページを指定できます。UpdatePanel コントロール内のコントロール (Button コントロールを含む) の既定の動作では、ポストバックの代わりに非同期ポストバックを実行します。この結果、ポストバックが発生した UpdatePanel コントロールの内容のみが更新されます。

Button コントロールを UpdatePanel コントロールの内部で使用するシナリオの他に、次のシナリオで、Button コントロールを UpdatePanel コントロールと共に使用できます。

  • UpdatePanel コントロールの外側にある Button コントロールを、そのパネルの AsyncPostBackTrigger コントロールとして定義します。ボタンがクリックされると、非同期ポストバックが開始され、パネルの内容が更新されます。

  • UpdatePanel コントロールの内側にある Button コントロールを、そのパネルの PostBackTrigger として定義します。ボタンがクリックされると、ボタンが UpdatePanel コントロールの内側にあってもポストバックが実行されます。

部分ページ レンダリングおよび UpdatePanel コントロールの使用法の詳細については、「UpdatePanel コントロールの概要」および「部分ページ レンダリングの概要」を参照してください。

ボタン コントロールのクライアント側イベントの処理

ボタン コントロールはサーバー イベントとクライアント イベントの両方を発生させることができます。サーバー イベントはポストバックの後で発生し、これらはページに対して記述するサーバー側コードで処理されます。クライアント イベントは、クライアント スクリプト、通常は ECMAScript (JavaScript) で処理され、ページが送信される前に発生します。ASP.NET ボタン コントロールにクライアント側のイベントを追加することによって、ページを送信する前に確認ダイアログ ボックスを表示し、場合によっては送信をキャンセルするなどのタスクを実行できます。詳細については、「ASP.NET Web ページのクライアント スクリプト」および「方法 : クライアント スクリプトで Button Web サーバー コントロール イベントに応答する」を参照してください。

データ コントロール内のボタン

Button Web サーバー コントロールは、DataListGridView、および Repeater リスト コントロールなどのデータ コントロール内で使用されることがよくあります。このような場合、通常は、ボタン クリック イベントに直接は応答しません。代わりに、データ コントロール内のボタンが、そのデータ コントロールに固有のイベントを発生します。たとえば、DataList コントロールでは、ボタンは Button コントロールの Click イベントを発生させる代わりに DataList コントロールの ItemCommand イベントを発生させます。

データ バインド リスト コントロールは数多くのボタンを含むことができるため、ボタンの CommandArgument プロパティを設定して、イベントの一部として渡す値を指定できます。この引数を調べると、クリックされたボタンを特定できます。

コントロールへのデータの連結

ボタン Web サーバー コントロールをデータ ソースにバインドし、プロパティ設定を動的に制御できます。たとえば、データ バインディングを使用してボタンの Text プロパティを設定できます。

ボタン コントロールに関連する主要なクラスの一覧を次の表に示します。

メンバ

説明

ButtonLinkButtonImageButton

ボタン コントロールのメイン クラスです。

ページのトップへ

表示: