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

Correctly Setting RadGrid Height When Using ASP.NET Master Page

2 Answers 101 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
David
Top achievements
Rank 1
David asked on 07 Feb 2013, 01:26 PM
When using the RadGrid in the following example the RadGrid height does not account for the height of content in the master page resulting in a vertical scroll bar being displayed. Do you have a recommended approach for correctly resizing the RadGrid when used with a master page?

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Deals.master.cs" Inherits="DueDiligenceGrid.Deals1" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  
<head runat="server">
    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>
</head>
<body>
    <div style="height: 100px; background-color: Blue;"></div>
    <form id="form1" runat="server">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
          
        </asp:ContentPlaceHolder>
    </form>
</body>
</html>
  
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Deals.aspx.cs" Inherits="DueDiligenceGrid.Deals" MasterPageFile="~/Deals.Master" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<%@ Register Src="~/Control/DealGrid.ascx" TagName="TelerikDealGrid" TagPrefix="dd" %>
  
<asp:Content ID="HeadContent" ContentPlaceHolderID="head" runat="server">
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
        <style type="text/css">
            html  
            {   
                overflow:auto; 
            }
                    
            html, 
            body
            {   
                height: 100%;   
                margin: 0px;   
                padding: 0px;  
            }   
        </style>
    </telerik:RadCodeBlock>
</asp:Content>
  
<asp:Content ID="MainContent" ContentPlaceholderID="ContentPlaceHolder1" runat="server">
    <telerik:RadSplitter 
        ID="TelerikDealGridSplitter" 
        runat="server"
        Orientation="Horizontal"
        Width="100%"
        Height="100%">
        <telerik:RadPane 
            ID="TelerikDealSearchPane" 
            runat="server"
            Height="100" 
            MaxHeight="100"
            ShowContentDuringLoad="false">
        </telerik:RadPane>
        <telerik:RadSplitBar 
            CollapseMode="Forward"
            ID="TelerikDealGridSplitBar" 
            runat="server" 
            EnableResize="True">
        </telerik:RadSplitBar>
        <telerik:RadPane ID="TelerikDealGridPane" runat="server" ShowContentDuringLoad="false">
            <telerik:RadScriptManager ID="DealScriptManager" runat="server" />
            <dd:TelerikDealGrid ID="TelerikDealGrid" runat="server" />      
        </telerik:RadPane>
    </telerik:RadSplitter>
</asp:Content>
  
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DealGrid.ascx.cs" Inherits="DueDiligenceGrid.Control.DealGrid" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<telerik:RadAjaxManager ID="TelerikDealGridAjaxManager" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="TelerikDealGrid">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="TelerikDealGrid" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
    <telerik:RadGrid 
        ID="TelerikDealGrid"
        runat="server" 
        OnSortCommand="TelerikDealGrid_SortCommand" 
        OnPageIndexChanged="TelerikDealGrid_PageIndexChanged"
        Width="100%"
        Height="100%" 
        OnPageSizeChanged="TelerikDealGrid_PageSizeChanged" 
        AllowSorting="True"
        PageSize="15" 
        AllowPaging="True" 
        AllowMultiRowSelection="True" 
        ShowGroupPanel="true"
        GridLines="None"
        Style="border: 0;">
        <MasterTableView Width="100%" Summary="Deal table" CommandItemDisplay="TopAndBottom">
            <CommandItemTemplate>
                <div style="height: 30px; text-align: left; background-color:Red">
                  
                </div>
            </CommandItemTemplate>
        </MasterTableView>
        <ClientSettings>
            <Scrolling AllowScroll="true" UseStaticHeaders="true" />
        </ClientSettings>
        <PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
    </telerik:RadGrid>

2 Answers, 1 is accepted

Sort by
0
Maria Ilieva
Telerik team
answered on 12 Feb 2013, 10:20 PM
Hello David,

Please try to set UpdatePanelsHeight property of the RadAjaxManager to 100% and verify if this makes any difference.

Kind regards,
Maria Ilieva
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.
0
David
Top achievements
Rank 1
answered on 17 Feb 2013, 11:12 AM
Thank you for your reply. Setting UpdatePanelHeight="100%" for the RadAjaxManager did not make any difference.
Tags
Ajax
Asked by
David
Top achievements
Rank 1
Answers by
Maria Ilieva
Telerik team
David
Top achievements
Rank 1
Share this question
or