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

Column width in insert/edit mode

3 Answers 345 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Cecilie Nordbø
Top achievements
Rank 1
Cecilie Nordbø asked on 02 Sep 2010, 09:57 AM
Hi.
I have grid where i want to set the column width for each column. I used the headerstyle-width and itemstyle-width for a column. Column width is set correct when the record is not in insert or edit mode. But in insert or edit mode, the column width is changing.  I have tried a lot of things, like not have a grid width, set the TableLayout to fixed, different combination of ItemStyle-width and HeaderStyle-width etc. unsuccessfully. So how can i set the column width for insert/edit mode?

the code i am using:
     <telerik:RadGrid ID="RadGrid2" runat="server" DataSourceID="LinqDataSource1" GridLines="None" Width="360px" >
        <MasterTableView AutoGenerateColumns="False" DataKeyNames="EmployeeCompanyNumber" DataSourceID="LinqDataSource1" CommandItemDisplay="Top">
        <CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>
        <RowIndicatorColumn><HeaderStyle Width="20px"></HeaderStyle></RowIndicatorColumn>
        <ExpandCollapseColumn><HeaderStyle Width="20px"></HeaderStyle></ExpandCollapseColumn>
        <Columns>                    
            <telerik:GridNumericColumn  ItemStyle-Width="70px" HeaderStyle-Width="80px" FilterControlWidth="90%" DataField="EmployeeCompanyNumber" DataType="System.Int32" HeaderText="Foretaksnr." SortExpression="EmployeeCompanyNumber" UniqueName="EmployeeCompanyNumber">
            </telerik:GridNumericColumn>
            <telerik:GridBoundColumn ItemStyle-Width="190px" HeaderStyle-Width="200px" FilterControlWidth="90%" DataField="Name" HeaderText="Navn" SortExpression="Name" UniqueName="Name" >
            </telerik:GridBoundColumn>
            <telerik:GridEditCommandColumn HeaderStyle-Width="140px" >
            </telerik:GridEditCommandColumn>
            <telerik:GridButtonColumn HeaderStyle-Width="40px" CommandName="Delete">            
            </telerik:GridButtonColumn>                   
        </Columns>
        <EditFormSettings><EditColumn UniqueName="EditCommandColumn1"></EditColumn></EditFormSettings>
        </MasterTableView>
    </telerik:RadGrid>

 



            

3 Answers, 1 is accepted

Sort by
0
Accepted
Princy
Top achievements
Rank 2
answered on 02 Sep 2010, 10:49 AM
Hello Cecilie,

If you want to change the width of column in edit/insert mode, access the control (rendered in edit/insert form) from code behind and set its width accordingly. Check out the sample code below.

C#:
protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
   {
      if (e.Item is GridEditFormInsertItem && e.Item.OwnerTableView.IsItemInserted)
       {
           GridEditFormInsertItem insertItem = (GridEditFormInsertItem)e.Item;
           TextBox txtbx = (TextBox)insertItem["Name"].Controls[0];
           txtbx.Width = 190;
       }
 
     if (e.Item is GridEditFormItem) && (e.Item.IsInEditMode)
       {
             GridEditFormItem editItem = (GridEditFormItem)e.Item;
             TextBox txtbx = (TextBox)editItem["Name"].Controls[0];
             txtbx.Width = 190;
       }
    }


Thanks,
Princy.
0
Cecilie Nordbø
Top achievements
Rank 1
answered on 27 Oct 2010, 10:50 AM
This solution works find for Firefox but not for Internet Explorer when using Unit.Percentage to set the column width like this: txtbx.Width = Unit.Percentage(columnWidth); 

The column field width is not effected and close to the end of the column field, a vertical line is showing, see attach file, the second columns. This problem is only when the field is a string/textbox.

Any idea who i can changed the column width when using IE and unit.Percentage?

0
Accepted
Dimo
Telerik team
answered on 28 Oct 2010, 10:10 AM
Hello Cecilie,

Percentage textbox widths are not supported in IE when you are using RadFormDecorator with rounded corners enabled.

Also, RadGrid column widths should be set by using HeaderStyle-Width only. Please remove all ItemStyle-Widths.

Kind regards,
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
Tags
Grid
Asked by
Cecilie Nordbø
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Cecilie Nordbø
Top achievements
Rank 1
Dimo
Telerik team
Share this question
or