ASP.NETでRadioButtonコントロールを使用する

2022-02-24 01:17:56

ASP.NETでRadioButtonコントロールを使用する

RadioButtonコントロールは、ラジオボタン・コントロールのグループをページに追加して、すべてのラジオボタンに同じGroupNameを割り当てることによって、与えられたオプションのセットから1つのオプションだけを強制的に選択させることができるようにします。

RadioButtonコントロールは、次の画像のようになります。

注：ラジオボタンコントロールは常にグループで表示されます。そして、一度に選択できるのは1つだけです。

RadioButton コントロールのプロパティ

ツールボックスからラジオボタンコントロールをaspxページにドラッグしたり、ページ上でラジオボタンコントロールを選択すると、ラジオボタンコントロールのプロパティがプロパティウィンドウに表示されます。次のイメージのように。

プロパティウィンドウの各プロパティをクリックすると、ウィンドウの下部にそのプロパティの説明が表示されます。

RadioButtonコントロールの重要なプロパティを以下に示します。

AccessKeyプロパティ

RadioButton コントロールを指示するキーボードショートカットキーを指定します。

AutoPostBackプロパティ

ラジオボタンがチェックされたとき、またはチェックが外されたときに、 RadioButton コントロールを含むフォームを自動的にサーバーにポストバックするために使用されます。

GroupNameプロパティ

GroupNameプロパティを使用して、ラジオボタンのグループを指定すると、相互に排他的なコントロールのグループを作成することができます。ラジオボタンのグループをページに追加する場合、GroupNameプロパティの値をすべてのラジオボタンで同じ値に設定すると、与えられたオプションのセットのうちの1つだけが選択されるように強制することができます。

チェック済みプロパティ

RadioButton コントロールの Checked プロパティの値は、コントロールがチェックされている場合は True、そうでない場合は False になります。

TextAlignプロパティ

RadioButtonコントロールは、Textプロパティでコントロールに表示するテキストを指定することができます。RadioButtonコントロールのTextAlignプロパティの値がLeftである場合、テキストはラジオボタンの左側に表示され、RadioButtonコントロールのTextAlignプロパティの値がRightである場合、テキストはラジオボタンの右側に表示されます。

RadioButton コントロールの共通イベント

RadioButtonコントロールの共通イベントはCheckedChangedで、これはRadioButtonコントロールの選択状態が変化したときに発生するイベントです。

インスタンス

次の aspx ページは、3 つの RadioButton コントロールを含んでいます。プログラムコードは以下の通りです。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ShowRadioButton.aspx.cs" Inherits=" ShowRadioButton" %>
<!DOCTYPE html PUBLIC "-/W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<script runat="server">
    protected void Button1_Click(object sender, EventArgs e)
    {
        if (RadioButton1.Checked)
            Label1.Text = RadioButton1.Text;
        if (RadioButton2.Checked)
            Label1.Text = RadioButton2;
        if (RadioButton3.Checked)
            Label1.Text = RadioButton3;
    }
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>ASP.NET using RadioButton control - www.baike369.com</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    What is your favorite ball game activity?
    <ul>
        <li>
            <asp:RadioButton
                ID="RadioButton1"
                Text="Basketball"
                GroupName="Sports"
                runat="server" />
        </li>
        <li>
            <asp:RadioButton
                ID="RadioButton2"
                Text="Football"
                GroupName="Sports"
                runat="server" />
        </li>
        <li>
            <asp:RadioButton
                ID="RadioButton3"
                Text="Badminton"
                GroupName="Sports"
                runat="server" />
        </li>
    </ul>
        <asp:Button
            ID="Button1"
            runat="server"
            Text="Submit" OnClick="Button1_Click" />
    <hr />
        <asp:Label
            ID="Label1"
            runat="server">
        </asp:Label>
    </div>
    </form>
</body>
</html>

実施した結果は以下の通りです。

上記のコードでは、GroupNameプロパティによってラジオボタンコントロールがラジオボタングループにグループ化されています。

ここでは、バドミントンの項目を選択し、[送信]ボタンをクリックすると、バドミントンの情報が表示されます。

チップ

選択されている回答をインタフェースに表示できるようにするには、RadionButton コントロールの CheckedChanged イベントで Checked プロパティを使用します。チェックされている場合は、表示されます。RadioButton ラジオボタンの CheckedChanged イベントコードは、次のとおりです。

protected void Button1_Click(object sender, EventArgs e)
{
    if (RadioButton1.Checked)
        Label1.Text = RadioButton1.Text;
    if (RadioButton2.Checked)
        Label1.Text = RadioButton2;
    if (RadioButton3.Checked)
        Label1.Text = RadioButton3;
}

ASP.NETでRadioButtonコントロールを使用する