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

Paging and 100% height

1 Answer 167 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Teija
Top achievements
Rank 1
Teija asked on 19 Jan 2009, 12:03 PM
I want to use paging in my radGrid but at the same time resize the grid to 100% height in my browser or div.
A bit like this example: http://demos.telerik.com/aspnet-ajax/Grid/Examples/Programming/CustomizingPager/DefaultCS.aspx but I want the page size to be variable and be based on the containers height and how many objects it can fit in the grid when maximized.
For example if the height is big then the grid would hold 100 objects per page and if I resize it smaller it could only hold 10 objects. And all this is controlled automatically and programatically.
How can I solve this?

1 Answer, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 19 Jan 2009, 02:06 PM
Hi Mathias,

I am not sure why you need this, because a lot better solution is to use the RadGrid scrolling feature (with or without static headers).

However, here is a possible approach. Resize the browser window to see how the PageSize changes.

The tecnique has one limitation - there is no way for RadGrid to know initially what will be the available space for the control, unless you calculate and pass it yourself.


<%@ Page Language="C#" %> 
<%@ Import Namespace="System.Data" %> 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
 
<script runat="server"
 
    protected void RadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e) 
    { 
        DataTable dt = new DataTable(); 
        DataRow dr; 
        int colsNum = 5
        int rowsNum = 2000
        string colName = "Column"
 
        for (int j = 1; j <= colsNum; j++) 
        { 
            dt.Columns.Add(String.Format("{0}{1}", colName, j)); 
        } 
 
        for (int i = 1; i <= rowsNum; i++) 
        { 
            dr = dt.NewRow(); 
 
            for (int k = 1; k <= colsNum; k++) 
            { 
                dr[String.Format("{0}{1}", colName, k)] = String.Format("{0}{1} Row{2}", colName, k, i); 
            } 
            dt.Rows.Add(dr); 
        } 
 
        (sender as RadGrid).DataSource = dt
    } 
 
    protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e) 
    { 
        RadGrid1.PageSize = Convert.ToInt16(int.Parse(e.Argument) / 22); 
        RadGrid1.Rebind(); 
    } 
     
</script> 
 
<!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"
<meta http-equiv="content-type" content="text/html; charset=utf-8" /> 
<title>RadControls for ASP.NET AJAX</title> 
<style type="text/css"
 
html{overflow:hidden} 
html,body,form{margin:0;height:100%;} 
 
</style> 
</head> 
<body> 
<form id="form1" runat="server"
<asp:ScriptManager ID="ScriptManager1" runat="server" /> 
 
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" BackColor="White" Transparency="50" /> 
 
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest"
    <AjaxSettings> 
        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1"
            <UpdatedControls> 
                <telerik:AjaxUpdatedControl ControlID="RadGrid1" /> 
            </UpdatedControls> 
        </telerik:AjaxSetting> 
    </AjaxSettings> 
</telerik:RadAjaxManager> 
 
<telerik:RadGrid 
    ID="RadGrid1" 
    runat="server" 
    Skin="Office2007" 
    AllowPaging="true" 
    Height="100%" 
    OnNeedDataSource="RadGrid_NeedDataSource"
    <MasterTableView TableLayout="Fixed" /> 
    <ClientSettings> 
        <Scrolling AllowScroll="true" UseStaticHeaders="true" /> 
    </ClientSettings> 
</telerik:RadGrid> 
 
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
<script type="text/javascript"
 
window.onresize = function() 
    $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest([document.documentElement.clientHeight]); 
 
</script> 
</telerik:RadCodeBlock> 
 
</form> 
</body> 
</html> 
 


Sincerely yours,
Dimo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Grid
Asked by
Teija
Top achievements
Rank 1
Answers by
Dimo
Telerik team
Share this question
or