Using RadionButtons inside PanelBar

5 posts, 0 answers
  1. Joseph
    Joseph avatar
    5 posts
    Member since:
    Jul 2013

    Posted 19 Mar 2015 Link to this post

    I have been tasked to use the PanelBar with Radio Buttons.   

    The mock up below pretty much explains my needs.    Attendee logs in.  Then they see Thursday, Friday, Saturday, and Sunday as Top Panel bar items.  When they click on Thursday, the time slot followed by courses represented with Radio buttons is displayed for user to select a course taken for that time slot.

    I have this all working with a combo box that the user selects which day they want and then the list shows.   However they have not changed there mind and want to use the PanelBar.

    Any how to and code examples will be welcome, I didn't find anything to help with this yet.

  2. Joseph
    Joseph avatar
    5 posts
    Member since:
    Jul 2013

    Posted 19 Mar 2015 in reply to Joseph Link to this post

    Ok I have figured out that I need a template.  So I have ported my code into a ItemTemplate.    However I can't access the controls from my code behind page.  Is there a way to do that.

            <ItemTemplate>

            <div id="RBL1" runat="server">
                <div class="RadioLabel">
                    <asp:Label ID="lblRadio1" runat="server"></asp:Label>
                </div>
    </ItemTemplate>
                <div class="RadioButton">
                    <asp:RadioButtonList ID="radio1" runat="server" RepeatLayout="Table" RepeatDirection="Vertical" >
                    </asp:RadioButtonList>
                </div>
            </div>
            <div id="RBL2" runat="server">
                <div class="RadioLabel">
                    <asp:Label ID="lblRadio2" runat="server"></asp:Label>
                </div>
                <div class="RadioButton">
                    <asp:RadioButtonList ID="radio2" runat="server" RepeatLayout="Table" RepeatDirection="Vertical" >
                    </asp:RadioButtonList>
                </div>
            </div>

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ivan Danchev
    Admin
    Ivan Danchev avatar
    833 posts

    Posted 20 Mar 2015 Link to this post

    Hello,

    You can use the following methods to access the Label and RadButtonList controls:

    protected void Page_Load(object sender, EventArgs e)
    {
        Label label = RadPanelBar1.FindItemByText("Item1").FindControl("lblRadio1") as Label;
        RadioButtonList buttonList = RadPanelBar1.FindItemByText("Item1").FindControl("radio1") as RadioButtonList;
    }

    This code snippet demonstrates how to get a RadPanelItem by its text ("Item1") and then find both controls in its ItemTemplate by their IDs.

    Regards,
    Ivan Danchev
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  5. Joseph
    Joseph avatar
    5 posts
    Member since:
    Jul 2013

    Posted 24 Mar 2015 in reply to Ivan Danchev Link to this post

    Ok I got past that, I needed to use a content template.

    I am now having troubles with the template scrolling

    Inside each Panel Item I dynamically create items for the radio button list..   As you can see in the attached, the Panel Item is the the Day.   I can't get the items below it to scroll when on Iphone screen.  It scrolls fine on the desktop but just wont on the phone.  I have tried changing the height as indicated in documentation as well as the ExpandMode.   Honestly I would like to used the ExpandMode="MultipleExpandedItems if possible.

    here is a snippet of code that I use to create the radio buttons for the radio list.

    html setting up panelbar

            <telerik:RadPanelBar runat="server" ID="RadPanelBar1" Height="100%" Width="100%" ExpandMode="MultipleExpandedItems">
            <Items>
                <telerik:RadPanelItem  OnLoad="Thursday_Load" CssClass="radPan" ForeColor="#304688" font-size="4em" Font-Bold="true"
                    Text="Thursday" ChildGroupHeight="3em"
                    runat="server">
                    
         
               <ContentTemplate>

    ***code behind
                            if (x == 1) // check to see if it belong in RadioGroup 1
                            {
                                // Checks to see if RadioNone is False and adds None to the RB group, this will be flipped to true on only 1 none is in RB Group
                                if (RadioNone1 == false)
                                    radio1.Items.Add(new ListItem("None", "None"));

                                radio1.Items.FindByValue("None").Selected = true;

                                // Build string for Radion Button Text attribute
                                string rbText = course.DayCode + "-" + course.CourseNumber.ToString() + " " + course.CourseName;
                                // Add New Radio Button to RB List, text and value which is Course ID
                                radio1.Items.Add(new ListItem(rbText, course.CourseID.ToString()));

                                // Test to see if attendee has a saved Course in this Radio Button List
                                // Set the Radion Buttion to checked if a match is found
                                foreach (var ac in attendeeCourses)
                                    if (course.CourseID == ac.CourseID)
                                    {
                                        radio1.Items.FindByValue(course.CourseID.ToString()).Selected = true;
                                        radioOpenValue1.Value = course.CourseID.ToString();
                                        if (ac.AttestDate != null)
                                        {
                                            radio1.Enabled = false;
                                        }
                                    }

                                // Sets the label for the Radio Group
                                lblRadio1.Text = DisplayTime(course.MilitaryBegin) + " - " + DisplayTime(course.MilitaryEnd);
                                lblRadio1.Visible = true;
                                RBL1.Visible = true;

                                // Sets bool to true so addional Nones are not added to RB Group
                                RadioNone1 = true;








  6. Ivan Danchev
    Admin
    Ivan Danchev avatar
    833 posts

    Posted 26 Mar 2015 Link to this post

    Hello,

    Since I am not able to replicate your scenario due to having access just to fragments of your code, I attached a sample project to this reply. It contains a RadPanelBar and one of its items holds a RadioButtonList with sample ListItems embedded in its ContentTemplate.

    Could you please try to reproduce the problem you are having in this project and post your modifications, so we can further test it and try to isolate the issue?

    Regards,
    Ivan Danchev
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017