RadioButton Web サーバー コントロールおよび RadioButtonList Web サーバー コントロールの概要
更新 : 2007 年 11 月
RadioButton コントロールおよび RadioButtonList コントロールを使用すると、ユーザーは、一度に 1 つしか選択できない、定義済みのオプション セットから項目を選択できます。
このトピックの内容は次のとおりです。
機能
背景
コード例
クラス リファレンス
機能
CheckBox コントロールおよび CheckBoxList コントロールを使用すると、以下を実行できます。
オプション ボタンが選択されたとき、ページ ポストバックを発生させる。
ユーザーがオプション ボタンを選択したとき、ユーザーとの対話をキャプチャする。
各オプション ボタンをデータベースのデータにバインドする。
ページのトップへ
背景
各 RadioButton コントロールまたは RadioButtonList コントロールの 2 種類の Web サーバー コントロールを使用すると、ASP.NET Web ページにオプション ボタンを追加できます。いずれのコントロールを使用した場合も、ユーザーは、一度に 1 つしか選択できない、定義済みのオプション セットから項目を選択できます。ラベル付きの任意の数のオプション ボタンを定義し、水平方向または垂直方向に配置できます。
RadioButton コントロールは、ページに複数追加でき、それぞれ単独で機能します。通常、2 つ以上の独立したボタンをグループ化します。
代わりに、RadioButtonList コントロールを使用することもできます。このコントロールは、オプション ボタン リスト項目のコレクションの親コントロールとして動作する、単一のコントロールです。このコントロールは、ListControl 基本クラスから派生したコントロールです。このため、ListBox、DropDownList、BulletedList、および CheckBoxList の各 Web サーバー コントロールと機能がよく似ています。RadioButtonList コントロールを使用するための手順は、他のリスト Web サーバー コントロールを使用する手順とほぼ同じです。
2 つのコントロールには、それぞれ利点があります。各 RadioButton コントロールを使用すると、RadioButtonList コントロールを使用する場合に比べ、オプション ボタン グループのレイアウトをより綿密に制御できるようになります。たとえば、オプション ボタンとオプション ボタンの間に、オプション ボタン以外のテキストを挿入できます。
データ ソースのデータに基づいてオプション ボタンのグループを作成する場合は、RadioButtonList コントロールを使用することをお勧めします。また、どのボタンが選択されたかを確認するコードの作成も多少簡単になります。
.gif "メモ") メモ : |
|---|
HtmlInputRadioButton サーバー コントロールを使用して、ASP.NET Web ページにオプション ボタンを追加することもできます。詳細については、「HtmlInputRadioButton サーバー コントロール宣言構文」を参照してください。 |
オプションの長い一覧や実行時に長さが変化する一覧をユーザーに提供する場合は、ListBox Web サーバー コントロールまたは DropDownList Web サーバー コントロールを使用します。
オプション ボタンのグループ化
通常、オプション ボタンは単独で使用しません。一般的には、相互に排他的なオプションの組み合わせになるようにグループ化します。グループ内で選択できるオプション ボタンは、一度に 1 つだけです。グループ化されたオプション ボタンを作成する方法は、次のとおりです。
ページに RadioButton Web サーバー コントロールを個別に追加し、1 つのグループにすべてのコントロールを手動で割り当てます。グループには任意の名前を指定できます。同じグループ名を持つすべてのオプション ボタンは、1 つのグループと見なされます。
RadioButtonList Web サーバー コントロールをページに追加します。コントロール内のリスト項目は、自動的にグループ化されます。
RadioButton イベントと RadioButtonList イベント
個別の RadioButton コントロールと RadioButtonList コントロールでは、イベントの動作が異なります。
各 RadioButton コントロール
個別の RadioButton コントロールをユーザーがクリックすると CheckedChanged イベントが発生します (このイベントは CheckBox コントロールを継承しています)。既定では、このイベントでは、サーバーにページがポストされません。ただし、AutoPostBack プロパティを true に設定すると、コントロールがポストバックをすぐに実行するように強制できます。このイベントに直接応答する方法の詳細については、「方法 : RadioButton Web サーバー コントロール グループにおけるユーザー選択に応答する」を参照してください。
| メモ : |
|---|
自動ポストバック機能を使用するには、ブラウザが ECMAScript (JScript または JavaScript) をサポートしており、このスクリプトがユーザーのブラウザで有効になっている必要があります。 |
場合によっては、CheckedChanged イベントのイベント ハンドラを作成する必要があります。ページの一部として実行される任意のコードで、どのオプション ボタンが選択されたか確認できます。一般に、CheckedChanged イベントのイベント ハンドラを作成するのは、現在の選択を読み取るだけでなく、オプション ボタンが変更されたことを知る必要がある場合に限られます。詳細については、「方法 : RadioButton Web サーバー コントロールの選択項目を設定および取得する」を参照してください。
RadioButtonList コントロール
RadioButtonList コントロールの場合は、リストでオンにするオプション ボタンをユーザーが変更すると、SelectedIndexChanged イベントが発生します。既定では、このイベントでは、サーバーにページがポストされません。ただし、AutoPostBack プロパティを true に設定すると、コントロールがポストバックをすぐに実行するように強制できます。詳細については、「方法 : リスト Web サーバー コントロールでの変更に応答する」を参照してください。
| メモ : |
|---|
自動ポストバック機能を使用するには、ブラウザが ECMAScript (JScript または JavaScript) をサポートしており、このスクリプトがユーザーのブラウザで有効になっている必要があります。 |
個々の RadioButton コントロールの場合と同様に、通常、RadioButtonList コントロールの状態のテストは、別の方法でページがポストされた後に行います。詳細については、「方法 : リスト Web サーバー コントロールの選択項目を確認する」を参照してください。
RadioButton コントロールの HTML 属性
RadioButton コントロールがブラウザに表示されるときは、オプション ボタンを表す input 要素と、それとは別の、オプション ボタンのキャプションを表す label 要素の 2 つの部分として表示されます。この 2 つの要素の組み合わせが span 要素にラップされます。
スタイルや属性の設定を RadioButton コントロールに適用すると、これらの設定は外側の span 要素に適用されます。たとえば、コントロールの BackColor プロパティを設定した場合、この設定は span 要素に適用されます。したがって、内側の input 要素と label 要素の両方に影響します。
オプション ボタンとラベルに対してそれぞれ別個の設定を行うことが必要な場合があります。RadioButton コントロールは、実行時に設定できる 2 つのプロパティをサポートします。InputAttributes プロパティでは、HTML 属性を input 要素に追加できます。また LabelAttributes プロパティでは、HTML 属性を label 要素に追加できます。設定した属性は、そのままブラウザに渡されます。ユーザーがマウス ポインタを合わせたときに、ラベルではなく、オプション ボタンの色だけが変化するように input 要素の属性を設定する方法を、次の例に示します。
RadioButton1.InputAttributes.Add("onmouseover", _
"this.style.backgroundColor = 'red'")
RadioButton1.InputAttributes.Add("onmouseout", _
"this.style.backgroundColor = 'white'")
RadioButton1.InputAttributes.Add("onmouseover",
"this.style.backgroundColor = 'red'");
RadioButton1.InputAttributes.Add("onmouseout",
"this.style.backgroundColor = 'white'");
コントロールへのデータの連結
個々の RadioButton コントロールはデータ ソースにバインドできます。また、RadioButton コントロールの各プロパティはデータ ソースの任意のフィールドにバインドできます。たとえば、データベースの情報から、コントロールの Text プロパティを設定することもできます。
通常、オプション ボタンはグループ化して使用するため、単一のオプション ボタンをデータ ソースにバインドすることはありません。一般的には、RadioButtonList コントロールをデータ ソースに関連付けます。連結した場合、データ ソースのレコードごとに、オプション ボタン (リスト項目) が動的に生成されます。
ページのトップへ
コード例
方法 : Web フォーム ページに RadioButton Web サーバー コントロールを追加する
方法 : Web フォーム ページに RadioButtonList Web サーバー コントロールを追加する (Visual Studio)
方法 : RadioButton Web サーバー コントロールの選択項目を設定および取得する
方法 : RadioButtonList Web サーバー コントロールにレイアウトを設定する
方法 : RadioButton Web サーバー コントロール グループにおけるユーザー選択に応答する
方法 : リスト Web サーバー コントロールに項目を追加する (Visual Studio)
方法 : データ ソースの項目をリスト Web サーバー コントロールに読み込む (Visual Studio)
方法 : リスト Web サーバー コントロールでの変更に応答する
ページのトップへ
クラス リファレンス
RadioButton コントロールと RadioButtonList コントロールに関連するクラスの一覧を次の表に示します。
メンバ |
説明 |
|---|---|
RadioButton コントロールのメイン クラスです。 |
|
RadioButtonList コントロールのメイン クラスです。 |
|
RadioButtonList コントロールの各項目を表すクラスです。 |
|
RadioButtonList コントロールの一覧の各項目に対応する項目のコレクションです。 |
ページのトップへ
参照
処理手順
方法 : リスト Web サーバー コントロールの選択項目を設定する (Visual Studio)
方法 : リスト Web サーバー コントロールの選択項目を確認する