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

[Solved] Splitter, RadPane, and Grid

1 Answer 181 Views

Splitter

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

Bailey Everitt asked on 05 Dec 2008, 02:17 AM

Hi Everyone,

I have a Splitter with two RadPanes (left and right.) A TreeView is in the left hand RadPane, and when nodes are clicked, the content pages are loaded into the right hand RadPane. I have one page that gets loaded into the right hand RadPane and all it containts is a Grid with a Master and Detail table. When the Grid expands past the height of the right hand RadPane, vertical AND horizontal scrollbars appear. The vertical one is fine, however, I do not want the horizontal scrollbar. My code is below. Any help is greatly appreciated.

FYI - It seems to work fine in FireFox but not in IE.

Page that contains the Splitter, RadPane:

    
            <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TRMS.aspx.cs" Inherits="Web.TRMS" %> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head id="Head1" runat="server"> 
        
                <title>ROSS Rewrite</title> 
        
                <script type="text/javascript" src="JavaScript/LoadPage.js"></script> 
        
                <style type="text/css"> 
        
                    html, body, form 
        
                    { 
        
                        height: 100%; 
        
                        padding: 0px; 
        
                        margin: 0px; 
        
                    } 
        
                </style>  
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:RadScriptManager ID="uxRadScriptManager" runat="server" /> 
        
                <div id="header" style="height: 40px; border-bottom: 1px black;"></div> 
        
                <telerik:RadSplitter ID="uxRadSplitter" runat="server" LiveResize="True" Skin="WebBlue" 
        
                    Height="100%" Width="100%" HeightOffset="62" SplitBarsSize="5px"> 
        
                    <telerik:RadPane ID="uxRadPaneLeft" runat="server" Height="17px" Width="250px" MaxWidth="400" 
        
                        MinWidth="200"> 
        
                        <telerik:RadTreeView ID="uxRadTreeView" Runat="server" LoadingMessage=""  
        
                            OnClientNodeClicked="ClientNodeClicked" Skin="Vista"  
        
                            onnodeexpand="uxRadTreeView_NodeExpand"  
        
                            Font-Names="Calibri" Font-Size="Medium"> 
        
                            <CollapseAnimation Duration="400" /> 
        
                            <ExpandAnimation Duration="400" /> 
        
                        </telerik:RadTreeView> 
        
                    </telerik:RadPane> 
        
                    <telerik:RadSplitBar ID="uxRadSplitBar" runat="server" /> 
        
                    <telerik:RadPane ID="uxRadPaneRight" runat="server" ContentUrl="about:blank"  
        
                        Height="100%"> 
        
                    </telerik:RadPane> 
        
                </telerik:RadSplitter> 
        
                <div id="footer" style="height: 20px; border-top: 1px black;"></div> 
        
                </form> 
        
            </body> 
        
            </html>

Page that contains the Grid:

    
            <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ListDetail.aspx.cs" Inherits="Web.ListDetail" %> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head runat="server"> 
        
                <title>Untitled Page</title> 
        
                <style type="text/css"> 
        
                    .RadGrid_Default 
        
                    { 
        
                        border: 1px solid #232323; 
        
                    } 
        
                    .RadGrid_Default 
        
                    { 
        
                        font: 11px/1.4 arial,sans-serif; 
        
                    } 
        
                    .RadGrid_Default 
        
                    { 
        
                        background: #d4d0c8; 
        
                        color: #333; 
        
                    } 
        
                    .MasterTable_Default 
        
                    { 
        
                        background: #fff; 
        
                        border-collapse: separate !important; 
        
                    } 
        
                    .MasterTable_Default 
        
                    { 
        
                        font: 11px/1.4 arial,sans-serif; 
        
                    } 
        
                    .GridHeader_Default 
        
                    { 
        
                        color: #fff; 
        
                        text-decoration: none; 
        
                    } 
        
                    .GridHeader_Default 
        
                    { 
        
                        border-bottom: 1px solid #010101; 
        
                        background: url(  'mvwres://Telerik.Web.UI, Version=2008.3.1105.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4/Telerik.Web.UI.Skins.Default.Grid.headers.gif' ) repeat-x #434343; 
        
                        padding: 10px 6px 10px 11px; 
        
                        text-align: left; 
        
                        font-size: 1.3em; 
        
                        font-weight: normal; 
        
                    } 
        
                    html, body, form 
        
                    { 
        
                        width:90%;  
        
                        margin: 0px auto;;  
        
                        padding: 0px;  
        
                        background: #e5ecf3;  
        
                    } 
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server"> 
        
                </telerik:RadStyleSheetManager> 
        
                <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> 
        
                </telerik:RadScriptManager> 
        
                <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> 
        
                    <AjaxSettings> 
        
                        <telerik:AjaxSetting AjaxControlID="RadGrid1"> 
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="RadGrid1" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                    </AjaxSettings> 
        
                </telerik:RadAjaxManager> 
        
                <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" GridLines="None" 
        
                    OnNeedDataSource="RadGrid1_NeedDataSource" Skin="WebBlue"  
        
                    OnDetailTableDataBind="RadGrid1_DetailTableDataBind"  
        
                    oncolumncreated="RadGrid1_ColumnCreated" Font-Bold="False"  
        
                    Font-Italic="False" Font-Names="Calibri" Font-Overline="False"  
        
                    Font-Size="Large" Font-Strikeout="False" Font-Underline="False"> 
        
                    <HeaderContextMenu EnableTheming="True" Skin="Hay"> 
        
                        <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> 
        
                    </HeaderContextMenu> 
        
                    <MasterTableView AutoGenerateColumns="True" font-bold="False"  
        
                        font-italic="False" font-names="Calibri" font-overline="False"  
        
                        font-size="Medium" font-strikeout="False" font-underline="False"> 
        
                        <DetailTables> 
        
                            <telerik:GridTableView runat="server" AutoGenerateColumns="True"  
        
                                BorderWidth="1px" Font-Bold="False" Font-Italic="False" Font-Names="Calibri"  
        
                                Font-Overline="False" Font-Size="Medium" Font-Strikeout="False"  
        
                                Font-Underline="False" GridLines="None"> 
        
                                <RowIndicatorColumn> 
        
                                    <HeaderStyle Width="20px" /> 
        
                                </RowIndicatorColumn> 
        
                                <ExpandCollapseColumn> 
        
                                    <HeaderStyle Width="20px" /> 
        
                                </ExpandCollapseColumn> 
        
                            </telerik:GridTableView> 
        
                        </DetailTables> 
        
                        <RowIndicatorColumn> 
        
                            <HeaderStyle Width="20px"></HeaderStyle> 
        
                        </RowIndicatorColumn> 
        
                        <ExpandCollapseColumn Visible="True"> 
        
                            <HeaderStyle Width="20px"></HeaderStyle> 
        
                        </ExpandCollapseColumn> 
        
            <EditFormSettings> 
        
            <EditColumn UniqueName="EditCommandColumn1"></EditColumn> 
        
            </EditFormSettings> 
        
                    </MasterTableView> 
        
                    <FilterMenu EnableTheming="True" Skin="Hay"> 
        
                        <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> 
        
                    </FilterMenu> 
        
                </telerik:RadGrid> 
        
                </form> 
        
            </body> 
        
            </html>

1 Answer, 1 is accepted

Accepted