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

[Solved] Change column size from code behind not working when resize enabled

3 Answers 323 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Michael Arocho
Top achievements
Rank 2
Michael Arocho asked on 10 Sep 2009, 02:38 PM
Hi,

I have a situation where I have 4 buttons and a RadGrid.  Each of the 4 buttons will set different column orders, visibility and widths.  Current I have theses enabled

<

 

Resizing AllowColumnResize="True" EnableRealTimeResize="True" ResizeGridOnColumnResize="True" />

 


What is happening is say I click on button 1 which sets each of the 4 columns headerstyle.width to 50px.  Then I hit button 2 which sets each of the 4 columns headerstyle.width to 100px.  I then drag column 1's width to like 200px.  Now I hit button 1 again.  My columns do not go back to 50px each.  However the second i start to drag any 1 of the columns for resizing after i hit the button 1 again the other columns immediatly shoot back to the 50px.

Why would setting the headers width not work, but as soon as i engage the dragging for resize mechanism again they all seem like they flip back to the width that was set?  Is there any way i can ensure that after i have programatically changed all of the columns header widths that they will actually be displayed as such?

3 Answers, 1 is accepted

Sort by
0
Dimo
Telerik team
answered on 11 Sep 2009, 11:25 AM
Hi Michael,

I am not sure what your implementation is, but please review the following example. Note that the RadGrid width is also changed, because if the sum of all column widths is less than the RadGrid width, all columns will expand.


<%@ Page Language="C#" %> 
<%@ Import Namespace="System.Data" %> 
<%@ 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"> 
 
<script runat="server"
 
protected void RadGrid_NeedDataSource(object sender, GridNeedDataSourceEventArgs e) 
    DataTable dt = new DataTable(); 
    DataRow dr; 
    int colsNum = 4
    int rowsNum = 5
    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 Button1_Click(object sender, EventArgs e) 
    { 
        if (!String.IsNullOrEmpty(RadNumericTextBox1.Value.ToString())) 
        { 
            int newWidth = int.Parse(RadNumericTextBox1.Value.ToString()); 
            RadGrid1.MasterTableView.GetColumn("Column1").HeaderStyle.Width = Unit.Pixel(newWidth); 
            RadGrid1.MasterTableView.GetColumn("Column2").HeaderStyle.Width = Unit.Pixel(newWidth); 
            RadGrid1.MasterTableView.GetColumn("Column3").HeaderStyle.Width = Unit.Pixel(newWidth); 
            RadGrid1.MasterTableView.GetColumn("Column4").HeaderStyle.Width = Unit.Pixel(newWidth); 
            RadGrid1.Width = Unit.Pixel(4 * newWidth); 
            Label1.Text = newWidth.ToString(); 
        } 
    } 
 
</script> 
 
<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> 
</head> 
<body> 
<form id="form1" runat="server"
<asp:ScriptManager ID="ScriptManager1" runat="server" /> 
 
Width: 
<telerik:RadNumericTextBox ID="RadNumericTextBox1" runat="server" Value="100" MinValue="1" MaxValue="300"
    <NumberFormat DecimalDigits="0" /> 
</telerik:RadNumericTextBox> 
 
<asp:Button ID="Button1" runat="server" Text="Apply" OnClick="Button1_Click" /> 
 
<br /><br /> 
 
Width applied is: <asp:Label ID="Label1" runat="server" Text="100" />px 
 
<br /><br /> 
 
<telerik:RadGrid 
    ID="RadGrid1" 
    runat="server" 
    Skin="Office2007" 
    Width="400px" 
    OnNeedDataSource="RadGrid_NeedDataSource"
    <MasterTableView TableLayout="Fixed"
        <HeaderStyle Width="100px" /> 
    </MasterTableView> 
    <ClientSettings> 
        <Resizing AllowColumnResize="true" EnableRealTimeResize="true" ResizeGridOnColumnResize="true" /> 
    </ClientSettings> 
</telerik:RadGrid> 
 
</form> 
</body> 
</html> 



Greetings,
Dimo
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Michael Arocho
Top achievements
Rank 2
answered on 14 Sep 2009, 05:02 PM
Ok, so adding up the widths and specifically setting the MasterTableView.Width works.  But what if they use percentages?  Or a mixture of pixel declarations and percentages?  Can it not take the rendered widths of each column and automatically resize the master table view to fit?
0
Pavel
Telerik team
answered on 16 Sep 2009, 09:45 AM
Hi Michael,

Unfortunately what you suggest cannot be done automatically. In this case in order to ensure the MasterTableView's width is not different then the sum of the widths of all columns you can try to leave one column without set width, thus enabling it to serve as a buffer and make up for the difference. You should note that generally this scenario will not behave in the same way in different browsers, but I can suggest you to experiment and see what works in your particular case.

Regards,
Pavel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Tags
Grid
Asked by
Michael Arocho
Top achievements
Rank 2
Answers by
Dimo
Telerik team
Michael Arocho
Top achievements
Rank 2
Pavel
Telerik team
Share this question
or