RadPanelBar height and width

5 posts, 0 answers
  1. Dylan
    Dylan avatar
    17 posts
    Member since:
    Apr 2013

    Posted 01 May 2013 Link to this post

    Hi,

    I have a radpanelbar in a radpane inside a splitter. The problem is when the radpanelbar have too many items, the height exceed the height of the radpane. How I can set the height of the radpanelbar do not exceed and it just scroll within the radpane ? Inside the splitter I have splitterbar too which the user can choose to expand to left or right, but the width of the radpanelbar did not follow the width of the radpane. How to make the radpanelbar width and height tie to the radpane, so when radpane expand, the radpanelbar follow. When radpane shrink, the radpanelbar will shrink too.

    <head runat="server">

    <title></title>
    <style type="text/css">

     html, body, form

    {

    margin:0px;
    padding:0px;

    height:100%;

    }

     </style>

     </head>

     <body>

    <form id="form1" runat="server">

     <div>

     <telerik:RadScriptManager ID="RadScriptManager1" Runat="server">

     </telerik:RadScriptManager>

     <telerik:RadSkinManager ID="RadSkinManager1" Runat="server">

     </telerik:RadSkinManager>

     <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server" Skin="Default">

     </telerik:RadAjaxLoadingPanel>

     <telerik:RadSplitter ID="RadSplitter1" Runat="server" Height="100%"  Orientation="Horizontal" style="margin-top: 0px" Width="100%">

    <telerik:RadPane ID="RadPane1" Runat="server" Height="52px" Scrolling="None">

    <table border="0" cellpadding="0" cellspacing="0" style="border: 0px none #000000" width="100%">

    <tr bgcolor="black">

    <td align="right" width="100">

    </td>

    <td style="background-color: #C0C0C0" valign="bottom">

        <asp:Label ID="lblDate" Runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="12px"     ForeColor="Black">
        </
    asp:Label>

    </td>

     <td align="right" style="background-color: #C0C0C0" valign="bottom">

     <asp:Label ID="lblUser" Runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="12px" ForeColor="Black"></asp:Label>

     <br />

     <asp:HyperLink ID="LogHyper" runat="server" Font-Bold="True" Font-Names="Arial" Font-Size="9pt" Font-Underline="True" ForeColor="Black" NavigateUrl="~/Login.aspx" Target="_parent">LOGOUT</asp:HyperLink>

     <br />

     </td>

     </tr>

     </table>

     </telerik:RadPane>

     <telerik:RadPane ID="RadPane2" Runat="server" Height="525px">

    <telerik:RadSplitter ID="RadSplitter2" Runat="server" Height="100%" Width="100%"> 
     <telerik:RadPane ID="RadPane3" Runat="server" Width="242px">
    <telerik:RadPanelBar ID="RadPanelBar1" Runat="server" Width="230px" Height="100%">
    </telerik:RadPanelBar>
    </telerik:RadPane>
    <telerik:RadSplitBar ID="RadSplitBar1" Runat="server">
    </telerik:RadSplitBar>
    <telerik:RadPane ID="Main" Runat="server" ContentUrl="about:blank" ShowContentDuringLoad="False">
    <asp:Panel ID="Panel1" runat="server">
    </asp:Panel>
    </telerik:RadPane>
    </telerik:RadSplitter>
    </telerik:RadPane>
    </telerik:RadSplitter
    </div>
    </form>

    </body>

     

  2. Ivan Zhekov
    Admin
    Ivan Zhekov avatar
    654 posts

    Posted 07 May 2013 Link to this post

    Hi, Dylan.

    In order to achieve the required scenario, you need to set the ExpandMode of the panel bar to FullExpandMode.

    Just like in the attached file.

    Regards,
    Ivan Zhekov
    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. Dylan
    Dylan avatar
    17 posts
    Member since:
    Apr 2013

    Posted 07 Jun 2013 Link to this post

    Hi Ivan,

    Thank you for your reply.

    It only solved the radpanelbar height problem, how I can make the radpanelbar width shrink and expand follow the radsplitbar ?
  4. Ivan Zhekov
    Admin
    Ivan Zhekov avatar
    654 posts

    Posted 11 Jun 2013 Link to this post

    Hello, Dylan.

    The width of the panelbar does follow the width of the containing pane. It's shown in the example I previously attached.

    Regards,
    Ivan Zhekov
    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.
  5. Dylan
    Dylan avatar
    17 posts
    Member since:
    Apr 2013

    Posted 11 Jun 2013 Link to this post

    Hi Ivan, 

    The sample solved my issue, but FullExpandMode alone didn't help, the width and height need to be set 100%.
    Thanks.
Back to Top