Skip Navigation LinksHome / Community & Support / Developer Productivity Tools Forums / Telerik MVC Extensions (superseded) > PanelBar > How to show desired panel expanded?

Answered How to show desired panel expanded?

Feed from this thread
  • Venkitachalam avatar

    Posted on Sep 1, 2010 (permalink)

    Hi,
    I am using Telerik Q2 2010. My view contains telerik panelbar inside telerik tabstrip.
    I want to show first panel as  expanded onload.
    For the same I have set following properties
        .ExpandMode(PanelBarExpandMode.Single) 
        .SelectedIndex(0)
    Even then first panel does not appear as expanded.
    What can we do to achieve this?
    I am using VS2008.

    thanks.
    chandran

    Reply

  • Alex Gyoshev Alex Gyoshev avatar

    Posted on Sep 2, 2010 (permalink)

    Hi Venkitachalam,

    We could not reproduce the problem. The solution used for testing is attached.

    Greetings,
    Alex Gyoshev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
    Attached files

    Reply

  • Venkitachalam avatar

    Posted on Sep 3, 2010 (permalink)

    Thanks Alex,
    for  your timely response.
    I found your solution working well but our requirement is slightly different.
    We are using templates inside panelbar.
    And when we use it in panelbar, it's not being expanded.
    For your reference, I've modified your code as below.
    <%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>
      
    <asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
        Home Page
    </asp:Content>
      
    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
        <h2><%= Html.Encode(ViewData["Message"]) %></h2>
          
        <% Html.Telerik().TabStrip()
                .Name("TabStrip")
                .SelectedIndex(0)
                .Items(tabstrip => {
                    tabstrip.Add().Text("PanelBar")
                        .Content(() =>
                        {
                            Html.Telerik().PanelBar()
                                .Name("PanelBar")
                                .Items(panelbar => {
                                    panelbar.Add().Text("Alpha")
                                        .Content(() =>
                                                {
                                                   %><input type="text" value="One"/> <%
                                                }
      
                                   );
                                    panelbar.Add().Text("Betta")
                                        .Items(betta =>
                                        {
                                            betta.Add().Text("Betta Alpha");
                                            betta.Add().Text("Betta Betta");
                                            betta.Add().Text("Betta Ghamma");
                                        });
                                    panelbar.Add().Text("Ghamma")
                                        .Items(ghamma =>
                                        {
                                            ghamma.Add().Text("Ghamma Alpha");
                                            ghamma.Add().Text("Ghamma Betta");
                                            ghamma.Add().Text("Ghamma Ghamma");
                                        });
                                })
                                .SelectedIndex(0)
                                .ExpandMode(PanelBarExpandMode.Single)
                                .Render();
                        });
                      
                    tabstrip.Add().Text("The other tab");
                })
                .Render();
        %>
    </asp:Content>

    As you can see here, I've added selected index property for tabstrip and added content for first panel of panelbar.
    And it's not being expanded.
    What can we do to expand in such a case?

    Thanks in advance,
    V. Chandran

    Reply

  • Answer Alex Gyoshev Alex Gyoshev avatar

    Posted on Sep 3, 2010 (permalink)

    Hi Venkitachalam,

    Add the following to your CSS:

            .t-panelbar .t-content 
            {
                display: block;
            }

    We'll fix this for the service pack, thank you for letting us know.

    Regards,
    Alex Gyoshev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

    Reply

  • Venkitachalam avatar

    Posted on Sep 6, 2010 (permalink)

    Thanks a Lot Alex !!! It is working well.

    Thanks,
    V. Chandran

    Reply

  • Darrien avatar

    Posted on Dec 20, 2010 (permalink)

    I am having the same problem, and was able to replicate using the source code in this posting.  Yet when I added the CSS block to Site.css it did not solve the issue.  Ideas?

    Reply

  • Alex Gyoshev Alex Gyoshev avatar

    Posted on Dec 20, 2010 (permalink)

    Hello Darrien,

    Are you using the Q3 release?

    All the best,
    Alex Gyoshev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

    Reply

  • Darrien avatar

    Posted on Dec 20, 2010 (permalink)

    Yes.  I upgraded the sample to Q3 as well to ensure I had the latest.

    Reply

  • Alex Gyoshev Alex Gyoshev avatar

    Posted on Dec 22, 2010 (permalink)

    Hello Darrien,

    Thanks for letting us know -- the correct CSS would be:

    .t-tabstrip .t-panelbar .t-content
    {
        display: block;
    }

    We added it to our stylesheet -- it will be available with upcoming builds.

    Regards,
    Alex Gyoshev
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

    Reply

  • Darrien avatar

    Posted on Dec 22, 2010 (permalink)

    Thanks.  That did the trick.

    Reply

  • Hernando avatar

    Posted on Feb 20, 2012 (permalink)

    good day!
    I have a PanelBar but does not expand the child, I wonder why is not working, thanks.



    <%= Html.Telerik().PanelBar()
                 .Name("menuGeneral")
                 .ExpandMode((PanelBarExpandMode)Enum.Parse(typeof(PanelBarExpandMode), PanelBarExpandMode.Single.ToString()))
                 .BindTo((IEnumerable<Nomina.Models.menuAplicacion>)ViewData["menu"], mappings =>
                 {
     
                     mappings.For<Nomina.Models.menuAplicacion>(binding => binding
                       .ItemDataBound((item, itm) =>
                       {
                           item.Text = itm.descripcion;
                           item.ImageUrl = Url.Content(itm.icono);
                           item.ImageHtmlAttributes.Add("style", "margin-right: 10px");
                       })
     
                        .Children(itm => Nomina.Models.itemsAplicacion.listaItems(itm.idmenu)));
                           mappings.For<Nomina.Models.itemsAplicacion>(binding => binding
                               .ItemDataBound((item, product) =>
                            { item.Text = product.descripcion; }));
     
     
                 })
    %>

    Reply

Back to Top

Skip Navigation LinksHome / Community & Support / Developer Productivity Tools Forums / Telerik MVC Extensions (superseded) > PanelBar > How to show desired panel expanded?
Related resources for "How to show desired panel expanded?"

ASP.NET MVC PanelBar Features  |  Documentation  |  Demos  |  Telerik TV ]