How to use RadButton as a Radio button list ?

5 posts, 0 answers
  1. wanlop
    wanlop avatar
    16 posts
    Member since:
    Nov 2010

    Posted 27 Jul 2012 Link to this post

    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
  2. Slav
    Admin
    Slav avatar
    1355 posts

    Posted 31 Jul 2012 Link to this post

    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
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. wanlop
    wanlop avatar
    16 posts
    Member since:
    Nov 2010

    Posted 03 Sep 2012 Link to this post

    Thank you for your answer.
  5. Curt
    Curt avatar
    82 posts
    Member since:
    Sep 2012

    Posted 03 May 2013 Link to this post

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

    Thanks
  6. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 08 May 2013 Link to this post

    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.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017