How to use RadButton as a Radio button list ?

[wanlop]

Hi,

I have seen your examples of using the RadioButton list already.

But I am looking for a way to display border with automatically.
It should be flexible according to the number of RadioButton that contained within.

Best Regards,
Ball

[Slav]

Hi Wanlop,

You can add a border around the list of radio RadButtons by placing them in a container element and setting a border via CSS:

<span style="padding: 10px; border: 1px solid black; display: inline-block;">
    <telerik:RadButton ID="RadButton16" runat="server" ToggleType="Radio" ButtonType="ToggleButton"
        Text="Option 1" GroupName="StandardButton" AutoPostBack="false">
    </telerik:RadButton>
    <br />
    <telerik:RadButton ID="RadButton17" runat="server" ToggleType="Radio" Checked="true"
        Text="Option 2" GroupName="StandardButton" ButtonType="ToggleButton" AutoPostBack="false">
    </telerik:RadButton>
    <br />
    <telerik:RadButton ID="RadButton18" runat="server" ToggleType="Radio" GroupName="StandardButton"
        Text="Option 3" ButtonType="ToggleButton" AutoPostBack="false">
    </telerik:RadButton>
    <telerik:RadButton ID="RadButton1" runat="server" ToggleType="Radio" GroupName="StandardButton"
        Text="Option 3" ButtonType="ToggleButton" AutoPostBack="false">
    </telerik:RadButton>
    <telerik:RadButton ID="RadButton2" runat="server" ToggleType="Radio" GroupName="StandardButton"
        Text="Option 3" ButtonType="ToggleButton" AutoPostBack="false">
    </telerik:RadButton>
</span>

Greetings,
Slav
the Telerik team

[wanlop]

Thank you for your answer.

[Curt]

Can you advise on how to get selected item value as well as how to clear the list?

Thanks

[Princy]

Hi Curt,

As far as I know, there is no RadioButtonList control in Telerik. If you are creating RadioButtonList using the above method, one option is to access each RadButton control inside the span and to get the Checked status as shown below.

ASPX:

<span id="span1" style="padding: 10px; border: 1px solid black; display: inline-block;">
    <telerik:RadButton ID="RadButton16" runat="server" ToggleType="Radio" ButtonType="ToggleButton"
        Text="Option 1" GroupName="StandardButton" AutoPostBack="false">
    </telerik:RadButton>
    <br />
    <telerik:RadButton ID="RadButton17" runat="server" ToggleType="Radio" Checked="true"
        Text="Option 2" GroupName="StandardButton" ButtonType="ToggleButton" AutoPostBack="false">
    </telerik:RadButton>
    <br />
    <telerik:RadButton ID="RadButton18" runat="server" ToggleType="Radio" GroupName="StandardButton"
        Text="Option 3" ButtonType="ToggleButton" AutoPostBack="false">
    </telerik:RadButton>
</span>
<br />
<br />
<asp:Button ID="Button1" runat="server" Text="Clear" onclick="Button1_Click" />
<br /><br />
<asp:Label ID="Label1" runat="server"></asp:Label>

C#:

protected void Button1_Click(object sender, EventArgs e)
{
    string selectedItem;
    if (RadButton16.Checked == true)
    {
        selectedItem = RadButton16.Text;
        RadButton16.Checked = false;
    }
    else if (RadButton17.Checked == true)
    {
        selectedItem = RadButton17.Text;
        RadButton17.Checked = false;
    }
    else
    {
        selectedItem = RadButton18.Text;
        RadButton18.Checked = false;
    }
    Label1.Text = "You Selected " + selectedItem;
}

Thanks,
Princy.