More in this section

Forums / Developing with Sitefinity / Controlling the Expanded property of a RadPanelItem

Controlling the Expanded property of a RadPanelItem

6 posts, 0 answered
  1. Joel Housman
    Joel Housman avatar
    12 posts
    Registered:
    28 Jul 2009
    01 Sep 2009
    Link to this post
    We are currently modifying a RadPanelBar with our own CSS to customize it's look and feel. We are trying to duplicate the functionality of the side navigation menu found on this site: http://www.greenbuildexpo.org/leed-workshops

    If you click around on the side menu of that site, you'll see what I mean. There are multiple parent menu items, some of which have child menu items. All of these sub menu's are collapsed by default. Only when you click on a parent menu item that also has child menu items, does it expand to show them.

    Our menu on our Telerik site is currently showing all child menus as expanded. In your documentation, found here: http://www.telerik.com/help/aspnet-ajax/panel_appearancecontrollingappearance.html we see that the "Expanded" property of a RadPanelItem property we need to modify to control this functionality. The question we have, is, how do we do that?

    Do we need to make a custom control where we modify that property? Do we need to edit our CSS in some way to incorporate this? Do we need to edit the control's properties within our template to modify this?


  2. Joel Housman
    Joel Housman avatar
    12 posts
    Registered:
    28 Jul 2009
  3. Nikolai
    Nikolai avatar
    216 posts
    Registered:
    01 Jun 2017
    02 Sep 2009
    Link to this post
    Hello Joel Housman,

    In the forum example you found, one of the parent items is always expanded and all the others are collapsed. You can try the same approach by using server code but there is another way by using the Client-Side JavaScript API. This way will reduce the server calls.
    You can either use the SitePanelBar control which is basically a wrapper for the RadPanelBar or create your own version and uploaded to Sitefinity. I think creating your own control is the better approach because you are going to modify a lot of things.

    Hope this helps.


    Greetings,
    Nikolai
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  4. Jay Mehta
    Jay Mehta avatar
    28 posts
    Registered:
    30 Jun 2009
    02 Sep 2009
    Link to this post
    Hi Nikolai

    Thank you for the response.
    Could I get a sample file of the RadPanelBar in which the script is used. This will help me get more understanding for using javascripts.

    Thank you,
    Jay Mehta.
  5. Jay Mehta
    Jay Mehta avatar
    28 posts
    Registered:
    30 Jun 2009
    02 Sep 2009
    Link to this post
    Just an addition, we are using SitePanelBar user control.

    Thank you,
    Jay Mehta.
  6. Nikolai
    Nikolai avatar
    216 posts
    Registered:
    01 Jun 2017
    03 Sep 2009
    Link to this post
    Hello Jay Mehta,

    We sent you an example in your support ticket but since this is public forum here is an example for everyone else:

    <telerik:RadPanelBar ID="RadPanelbar1" OnClientItemClicked="ExpandItem" AllowCollapseAllItems="false" ExpandMode="SingleExpandedItem" runat="server" DataSourceID="SiteMapDataSource1" OnItemDataBound="RadPanelbar1_ItemDataBound" EnableViewState="true"></telerik:RadPanelBar> 
    and the JS API function:
    <script type="text/javascript"
        function ExpandItem(panelbar, args) {        
                args.get_item().set_expanded(true);        
        } 
     
    </script> 


    Greetings,
    Nikolai
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Register for webinar
6 posts, 0 answered