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

[Solved] RadGrid defaults to 100% wide

6 Answers 238 Views

Grid

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

6 Answers, 1 is accepted

answered on 25 May 2009, 11:50 AM

Hi Scott,

Here is how to have a RadGrid, which does not expand to 100% in width, but only takes up the minimum space required:

    
            <%@ 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 = 3; 
        
                    int rowsNum = 10; 
        
                    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; 
        
                } 
        
            </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"> 
        
            .AutoExpand 
        
            { 
        
                float:left; 
        
            } 
        
            .AutoExpand, 
        
            .AutoExpand .rgMasterTable 
        
            { 
        
                width:auto !important; 
        
            } 
        
            </style> 
        
            </head> 
        
            <body> 
        
            <form id="form1" runat="server"> 
        
            <asp:ScriptManager ID="ScriptManager1" runat="server" /> 
        
            <p>content before</p> 
        
            <telerik:RadGrid 
        
                ID="RadGrid1" 
        
                runat="server" 
        
                CssClass="AutoExpand" 
        
                OnNeedDataSource="RadGrid_NeedDataSource"> 
        
            </telerik:RadGrid> 
        
            <div style="clear:both"><!-- --></div> 
        
            <p>content after</p> 
        
            </form> 
        
            </body> 
        
            </html>

Greetings,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

answered on 27 May 2010, 04:58 AM

I've been using this solution since the end of last year and all was good, however I have just noticed that its not working is some situations. I'm wondering if it's to do with my upgrading from 2009Q2 to 2010Q1.

Based on a user clicking a button or two I call the following methods to allow the user to alter properties of the grid (Note for other reasons AllowDragToGroup is also set else where):

    
                    /// <summary>  
        
                    /// Open the grid up to full manipulation by the user (ie. Column order, grouping, etc.)  
        
                    /// </summary>  
        
                    private void Edit_AllowFullGridManipulation()  
        
                    {  
        
                        MyGrid.PagerStyle.AlwaysVisible = true;  
        
                        MyGrid.ClientSettings.AllowColumnsReorder = true;  
        
                        MyGrid.ClientSettings.AllowDragToGroup = true;  
        
                        MyGrid.ClientSettings.Resizing.AllowColumnResize = true;  
        
                        // Make all the column fully customisable  
        
                        foreach (GridColumn col in MyGrid.MasterTableView.Columns)  
        
                        {  
        
                            col.Reorderable = true;  
        
                            col.Resizable = true;  
        
                        }  
        
                        MyGrid.Rebind();  
        
                    }  
        
                    /// <summary>  
        
                    /// Open the grid up to full manipulation by the user (ie. Column order, grouping, etc.)  
        
                    /// </summary>  
        
                    private void Edit_RemoveFullGridManipulation()  
        
                    {  
        
                        MyGrid.PagerStyle.AlwaysVisible = false;  
        
                        MyGrid.ClientSettings.AllowColumnsReorder = false;  
        
                        MyGrid.ClientSettings.Resizing.AllowColumnResize = false;  
        
                        // Remove all the column customisable features  
        
                        foreach (GridColumn col in MyGrid.MasterTableView.Columns)  
        
                        {  
        
                            col.Reorderable = false;  
        
                            col.Resizable = false;  
        
                        }  
        
                        MyGrid.Rebind();  
        
                    }

All my column widths set to a value and after calling Edit_RemoveFullGridManipulation it all works fine but after Edit_AllowFullGridManipulation is called the grid goes to 100% width. The unfortunate thing about this is that thats the worst time to try and resize columns because change one column width effects other columns.

answered on 28 May 2010, 11:51 AM

Hello Richard,

Please also set

myGrid.ClientSettings.Resizing.ClipCellContentOnResize = false;

ClipCellContentOnResize is true by default and until recenlty, it triggers a fixed TableLayout for the MasterTableView, which causes it to expand. The fixed table layout is actually required for this feature to work, but it was not set automatically in previous versions.

All the best,
Dimo
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

Accepted