使用母版页时,如何正确调整Telerik RadGrid的高度

时间:2013-02-08 14:25:07

标签: asp.net telerik telerik-grid

我在RadSpl的RadPane中有一个高度为100%的Telerik RadGrid,它的高度也是100%。如果我没有母版页,RadGrid会自动调整大小到浏览器窗口的高度而没有问题。如果我使用母版页,则该母版页的内容高度不包括在计算中,因此RadGrid的页脚会被截断。任何人都可以提出解决这个问题的最佳方法吗?

Truncated RadGrid

母版页

<head runat="server">
    <title></title>
    <style type="text/css">
        html, body, form 
        {
            height:100%;
            margin: 0px;
            padding: 0px;
            overflow: hidden;    
        }
    </style>
    <asp:ContentPlaceHolder id="head" runat="server" />
</head>
<body>
    <div style="height:100px; background-color:blue;">Test Master Content</div>
        <form id="form1" runat="server">
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />
            <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" />
            <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server" />
        </form>
</body>

儿童页面

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <telerik:RadSplitter ID="RadSplitter1" runat="server" Width="100%" Height="100%" Orientation="Horizontal">
        <telerik:RadPane ID="RadPane1" runat="server" Width="100%" height="50px" BackColor="Red">
             <p>This is a test</p>
        </telerik:RadPane>
        <telerik:RadSplitBar ID="RadSplitBar1" runat="server" />
        <telerik:RadPane ID="RadPane2" runat="server" Width="100%" Height="100%">
            <telerik:RadAjaxManagerProxy ID="AjaxManagerProxy1" runat="server">
                <AjaxSettings>
                    <telerik:AjaxSetting AjaxControlID="RadGrid1">
                        <UpdatedControls>
                            <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                        </UpdatedControls>
                    </telerik:AjaxSetting>
                </AjaxSettings>
            </telerik:RadAjaxManagerProxy>
            <telerik:RadGrid ID="RadGrid1" 
            runat="server" 
            Width="100%"
            Height="100%"
            OnNeedDataSource="RadGrid1_NeedDataSource" />
    </telerik:RadPane>
    </telerik:RadSplitter>
   </asp:Content>

1 个答案:

答案 0 :(得分:1)

您将固定高度与相对高度相结合,主体是浏览器高度的100%,但增加了100px,将其发送到屏幕上。 在内容中你有radpane 2 100%但Radpane1是50px ...所以它再次被推离屏幕 - 但是你让radsplitter说只显示100%的浏览器,因此切断 您需要使用这些值,直到您觉得它看起来可以接受为止,尝试将radsplitter设置为140%...并欢迎使用css tweakville