This is a migrated thread and some comments may be shown as answers.

Setting Radsplitter Height to its content

3 Answers 215 Views
Splitter
This is a migrated thread and some comments may be shown as answers.
neo
Top achievements
Rank 1
neo asked on 29 Nov 2009, 06:26 AM
Hello guys,

I want to make radsplitter get height from its content dynamically, not static height. I mean I don't want splitter to have scroll bars, instead using explorer natural scroll bars. Splitter has 2 panes; the left pane is a radpane menu which is higher than entire window and the right pane is a dynamic content with arbitrary heights. In this case I get 2 annoying scroll bars or my contents are hidden. I don't want either case. I want simply one scroll bar on explorer and to achieve this splitter have to get height from content dynamically.

This was OK inTelerik 2008 but in Telerik 2009 I have this problem.

This is a sample code showing the problem:

<%@ Page Language="VB" AutoEventWireup="true" %> 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">  
<head id="Head1" runat="server">  
    <title></title>  
</head> 
<body> 
    <form id="form2" runat="server">  
    <asp:ScriptManager ID="ScriptManager" runat="server" /> 
    <telerik:RadSplitter ID="NestedSplitter" runat="server" Skin="Outlook" Width="100%" 
        Height="930">  
        <telerik:RadPane ID="LeftPane" runat="server" Width="200" MinWidth="150" MaxWidth="400">  
            <div style="background-color: GrayText; height: 920px;">  
                This is a static menu. Height is 920px.  
            </div> 
        </telerik:RadPane> 
        <telerik:RadSplitBar ID="VerticalSplitBar" runat="server" CollapseMode="Forward" /> 
        <telerik:RadPane ID="ContentPane" runat="server">  
            <div style="background-color: Gray; height: 5000px;">  
                This is a dynamic content. Current height is 5000px.  
                <br /> 
                I want splitter height be 5000px dynamically.  
            </div> 
        </telerik:RadPane> 
    </telerik:RadSplitter> 
    </form> 
</body> 
</html> 
 

I would thanks in advance for any help.

Regards.

3 Answers, 1 is accepted

Sort by
0
Svetlina Anati
Telerik team
answered on 01 Dec 2009, 10:34 AM
Hi neo,

For the time being, there is no simple way (e.g. set a property) to achieve the desired functionality. The RadSplitter control offers a rich clientside API, however, that you can use to achieve the desired result.

I would recommend that you use the OnClientLoaded handler of the RadSplitter object to calculate the Height of the content of the RadPane and set that value as Height of the RadPane. You can find additional information along with a sample demo in the following location:

http://www.telerik.com/support/kb/aspnet-ajax/splitter/initially-resize-the-radsplitter-according-to-its-content.aspx

Let us know if you need additional help with that.



Kind regards,
Svetlina
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.
0
neo
Top achievements
Rank 1
answered on 05 Dec 2009, 06:47 AM
Hi Svetlina,

Thanks for your reply. It works great. But now I have another problem which as follows:
In some forms the content height in Radpane2 or ContentPane will be changed in javascript and no ClientLoaded event will be raised. One example of this is when I use Ajax Controls Toolkit CollapsiblePanelExtender :

    <asp:Panel ID="Help" runat="server" Width="100%">  
        &nbsp; &nbsp;  
        <asp:HyperLink ID="hypHelp" runat="server">  
            <asp:Image ID="imgHelp" runat="server" ImageAlign="AbsMiddle" ImageUrl="~/Mod_Core/UserControls/Monitor/MonitorList/Help.gif" />&nbsp;  
            <asp:Label ID="lblHelp" runat="server" Text="<% $Resources:lblHelp %>"></asp:Label> 
        </asp:HyperLink> 
        <cc1:CollapsiblePanelExtender ID="ClpxMonitorHelp" runat="server" CollapseControlID="hypHelp" 
            Collapsed="true" CollapsedSize="0" ExpandControlID="hypHelp" ExpandedSize="120" 
            TargetControlID="pnlHelp">  
        </cc1:CollapsiblePanelExtender> 
        <asp:Panel ID="pnlHelp" runat="server" BackColor="whiteSmoke" Width="99%">  
            <br /> 
            <asp:Literal ID="ltl2" runat="server" Text="<% $Resources:ltl2 %>"></asp:Literal><br /> 
            <br /> 
            <asp:Literal ID="ltl3" runat="server" Text="<% $Resources:ltl3 %>"></asp:Literal><br /> 
            <asp:Literal ID="ltl4" runat="server" Text="<% $Resources:ltl4 %>"></asp:Literal> 
            <br /> 
            <br /> 
            &nbsp; &nbsp;  
            <asp:Literal ID="ltl5" runat="server" Text="<% $Resources:ltl5 %>"></asp:Literal><br /> 
            &nbsp; &nbsp;  
            <asp:Literal ID="ltl6" runat="server" Text="<% $Resources:ltl6 %>"></asp:Literal>&nbsp;  
            &nbsp; &nbsp; &nbsp;  
            <br /> 
        </asp:Panel> 
        <br /> 
        <br /> 
    </asp:Panel> 
 

As you can see here I use this to show some help. CollapsiblePanelExtender shows/hides a panel in client side by clicking on a link and therefore changing the height of radpane content.

Best Regards,
neo
0
Svetlina Anati
Telerik team
answered on 09 Dec 2009, 11:53 AM
Hi neo,

 In this case you should hook up to the particular event. For example, if you replace the collapsible panel e.g with a RadToolTip, you can use its OnClientShow event. This being said, it is up to you and your custom logic what event to capture (e.g onmouseover with some timeout and check for visibility might work in your case).


Kind regards,
Svetlina
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.
Tags
Splitter
Asked by
neo
Top achievements
Rank 1
Answers by
Svetlina Anati
Telerik team
neo
Top achievements
Rank 1
Share this question
or