radtreeview inside radpanelbar : height 100% not working

4 posts, 0 answers
  1. mirang
    mirang avatar
    115 posts
    Member since:
    Aug 2010

    Posted 03 Apr 2012 Link to this post

    I have a radtreeview inside the radpanelbar. I have set the expandmode to fullexpandeditem and the height to 100% at all level above the radtreeview. The code is as follows : 

    .NavigationPanelItemClass
            {
                overflow: hidden !important;
            }
     <telerik:RadPanelBar ExpandMode="FullExpandedItem" Height="100%" ID="RadPanelBar1"
                runat="server">
                <Items>
                    <telerik:RadPanelItem ChildGroupCssClass="NavigationPanelItemClass" Expanded="true"
                        Height="100%" runat="server" Text="Tab 1">
                        <Items>
                            <telerik:RadPanelItem Height="100%" runat="server">
                                <ItemTemplate>
                                    <telerik:RadTreeView CssClass="TreeClass" Height="100%" ID="RadTreeView1"
                                        runat="server">
                                        <Nodes>
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                            <telerik:RadTreeNode Text="First" />
                                        </Nodes>
                                    </telerik:RadTreeView>
                                </ItemTemplate>
                            </telerik:RadPanelItem>
                        </Items>
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem runat="server" Text="Tab 2">
                    </telerik:RadPanelItem>
                </Items>
                <ExpandAnimation Duration="0" />
                <CollapseAnimation Duration="0" />
            </telerik:RadPanelBar>

    I have set the scrollbars to hidden for the panelitem as i want only the radtreeview scrollbars and not the radpanelitem's. Even after this the scrollbars are not getting displayed for the tree. Can you please redirect to some solution for this.
  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 06 Apr 2012 Link to this post

    Hi Mirang,

    Please take a look at the modified code below that I believe represents the desired behavior. Note also that I changed the ExpandMode property to MultipleExpandedItems:
    <style type="text/css">
            .NavigationPanelItemClass
            {
                overflow: hidden !important;
            }
             
            .tree-panel
            {
                margin: 0 20px;
            }
        </style>

    markup:
    <telerik:RadPanelBar ExpandMode="MultipleExpandedItems" Height="100%" ID="RadPanelBar1"
                runat="server">
                <Items>
                    <telerik:RadPanelItem ChildGroupCssClass="NavigationPanelItemClass" Expanded="true"
                        Height="100%" runat="server" Text="Tab 1">
                        <Items>
                            <telerik:RadPanelItem Height="100%" runat="server">
                                <ItemTemplate>
                                    <div class="tree-panel">
                                        <telerik:RadTreeView CssClass="TreeClass" Height="100px" ID="RadTreeView1" runat="server">
                                            <Nodes>
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                                <telerik:RadTreeNode Text="First" />
                                            </Nodes>
                                        </telerik:RadTreeView>
                                    </div>
                                </ItemTemplate>
                            </telerik:RadPanelItem>
                        </Items>
                    </telerik:RadPanelItem>
                    <telerik:RadPanelItem runat="server" Text="Tab 2">
                    </telerik:RadPanelItem>
                </Items>
                <ExpandAnimation Duration="0" />
                <CollapseAnimation Duration="0" />
            </telerik:RadPanelBar>

    If this is not the desired appearance I would like to ask you to clarify what is the desired behavior of the two controls that you are trying to achieve so I can help you out?

    Kind regards,
    Kate
    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. Chandrak
    Chandrak avatar
    12 posts
    Member since:
    Oct 2012

    Posted 19 Dec 2012 Link to this post

    Hi,

    Can we access treeview positioned like above (inside itemtemplate) from C#? I am creating nodes from code behind? Can you please let me know how?

    " 'RadTreeViewDevices' does not exist in the current context"
    (after keeping in itemtemplate.. I want treeview inside sliding panel)


    Thanks
    Chandresh
  5. Chandrak
    Chandrak avatar
    12 posts
    Member since:
    Oct 2012
Back to Top