Suppress horizontal scroll bar on RadTreeList

5 posts, 0 answers
  1. Christopher
    Christopher avatar
    10 posts
    Member since:
    Dec 2008

    Posted 29 Nov 2013 Link to this post

    I am using the RadTreeList and have enabled scrolling. The RadTreeList reserves room at the bottom for a horizontal scroll bar whether or not a horizontal scroll bar is needed. How do I suppress the horizontal scroll bar or change the behavior so the RadTreeList does not reserve room at the bottom? In my case I never want a horizontal scroll bar to appear whether or not it is needed. 

    Here is my code:

    <telerik:RadTreeList ID="RadTreeView2" runat="server" DataKeyNames="ProductID" ParentDataKeyNames="ParentID" Height="350px"  
                      OnTreeNodeDataBound="RadTreeView2_TreeNodeDataBound" OnItemCommand="RadTreeView2_UpdateCommand"
        OnItemDataBound="RadTreeView2_ItemDataBound" OnCancelCommand="RadTreeView2_CancelCommand"
        OnNeedDataSource="RadTreeList2_NeedDataSource" EnableViewState="true" Width="100%"
        EditMode="InPlace" AllowMultiItemEdit="true" AutoGenerateColumns="False">
        <Columns>
            <telerik:TreeListBoundColumn DataField="ProductName" UniqueName="ProductName" Resizable="true" HeaderStyle-Width="100%"
                HeaderText="Product Name" >
            </telerik:TreeListBoundColumn>
            <telerik:TreeListNumericColumn DataField="Supply_FTE" UniqueName="Supply_FTE" HeaderText="Supply FTE" Resizable ="true"
                DecimalDigits="2" HeaderStyle-HorizontalAlign="Center" HeaderStyle-Width="100px"
                ItemStyle-Width="100px" NumericType="Number" ItemStyle-HorizontalAlign="Center"
                DataFormatString="{0:N2}">
            </telerik:TreeListNumericColumn>
            <telerik:TreeListNumericColumn DataField="Supply_Percent" UniqueName="Supply_Percent" Resizable ="true"
                NumericType="Percent" HeaderText="Supply Percent" HeaderStyle-HorizontalAlign="Center"
                HeaderStyle-Width="100px" ItemStyle-Width="100px" ItemStyle-HorizontalAlign="Center"
                DataFormatString="{0:P2}">
            </telerik:TreeListNumericColumn>
            <telerik:TreeListBoundColumn DataField="ResID" UniqueName="ResID" HeaderText="ResID" MaxWidth="0"
                Visible="false">
            </telerik:TreeListBoundColumn>
            <telerik:TreeListBoundColumn DataField="UserID" UniqueName="UserID" Visible="false" MaxWidth="0"
                HeaderText="UserID">
            </telerik:TreeListBoundColumn>
            <telerik:TreeListBoundColumn DataField="OrgID" UniqueName="OrgID" Visible="false" MaxWidth="0"
                HeaderText="OrgID">
            </telerik:TreeListBoundColumn>
            <telerik:TreeListEditCommandColumn UniqueName="Edit" ShowAddButton="False" ButtonType="ImageButton" Resizable="false"
                EditText="Edit" UpdateText="Update" Display="true" Visible="true" HeaderStyle-Width="55px" ItemStyle-Width="55px"
                 MinWidth="55px" MaxWidth="55px"  >
            </telerik:TreeListEditCommandColumn>
        </Columns>
        <ClientSettings>
            <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true"   />
            <Resizing AllowColumnResize="False"  EnableRealTimeResize="true"  />
        </ClientSettings>
    </telerik:RadTreeList>
  2. Galin
    Admin
    Galin avatar
    526 posts

    Posted 04 Dec 2013 Link to this post

    Hello Christopher,

    In order to achieve your requirement you can use the property ScrollHeight instead Height, e.g.:

    <telerik:RadTreeList ID="RadTreeView2" runat="server" DataKeyNames="ProductID" ParentDataKeyNames="ParentID"
        OnNeedDataSource="RadTreeList2_NeedDataSource" EnableViewState="true" Width="100%"
        EditMode="InPlace" AllowMultiItemEdit="true" AutoGenerateColumns="False">
        <Columns>
            ...
            ...
            ...
        </Columns>
        <ClientSettings>
            <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="true" ScrollHeight="300px" />
            <Resizing AllowColumnResize="False" EnableRealTimeResize="true" />
        </ClientSettings>
    </telerik:RadTreeList>

    I hope this helps.

    Regards,
    Galin
    Telerik
    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 the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Christopher
    Christopher avatar
    10 posts
    Member since:
    Dec 2008

    Posted 18 Dec 2013 Link to this post

    That worked, perfectly.

    Thanks.
    Chris 
  5. Mark
    Mark avatar
    4 posts
    Member since:
    Dec 2013

    Posted 03 Nov 2014 Link to this post

    I have Treelist within a CSS panel/box and overflow is auto (turns scrolling on). When Allowscroll is on, the thumbnail in the scroll bar turns to blue.  Is there a way change that color of the thumbnail?

       <Clientsettings>
    <scrolling Allowscroll="True" UseStaticHeaders ="True" SaveScrollPosition="True"></scrolling>
    </Clientsettings>
  6. Galin
    Admin
    Galin avatar
    526 posts

    Posted 05 Nov 2014 Link to this post

    Hi Mark,

    Could you please elaborate a bit more on this matter and what do you mean by the thumbnail in the scroll bar turns to blue? Also if it is possible send us the code you are using and a screenshot demonstrating the problem.

    Thank you for the cooperation.

    Regards,
    Galin
    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.

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