How to set width of edit field in GridViewDataColumn

4 posts, 0 answers
  1. Roger
    Roger avatar
    32 posts
    Member since:
    Feb 2009

    Posted 14 Jan 2011 Link to this post

    I have an editable RadGridView with set column widths.  When the user clicks a cell to edit its contents, the editing TextBox appears to be much more narrow than the width of its column.  How can I change this so that the TextBox stretches to the column width?

    I tried using a template for the cell but this prevented the cell/row validation from working:
    <DataTemplate x:Name="editCellTemplate">
            <TextBox MaxLength="100" Margin="5,3"
                     Width="{Binding ActualWidth,
                                   AncestorType={x:Type telerik:GridViewCell}}}"
                     Text="{Binding Label, Mode=TwoWay}" />
    <telerik:RadGridView Margin="10" MinHeight="300" RowHeight="30"
                  HorizontalAlignment="Left" VerticalAlignment="Top"
                  AutoGenerateColumns="False" IsFilteringAllowed="False"
                  CanUserInsertRows="True" CanUserDeleteRows="False"
                  CanUserFreezeColumns="False" CanUserReorderColumns="False"
                  ShowGroupPanel="False" ShowInsertRow="True"
                  ItemsSource="{Binding SourceView, Mode=OneWay}">
            <telerik:GridViewDataColumn x:Name="Label" Header="Label" Width="300"
                               DataMemberBinding="{Binding Label, Mode=TwoWay}"
                               CellEditTemplate="editCellTemplate" />
            <telerik:GridViewCheckBoxColumn x:Name="Inactive" Header="Inactive"
                                 DataMemberBinding="{Binding IsDeleted, Mode=TwoWay}"
                                 Width="Auto" />

    Then I tried setting the CellStyle property, but this had no effect:
            <Setter Property="TextBox.MaxLength" Value="100" />
            <Setter Property="TextBox.Margin" Value="5" />
            <Setter Property="TextBox.Width"
                  Value="{Binding ActualWidth, RelativeSource={RelativeSource
                     Mode=FindAncestor, AncestorType={x:Type telerik:GridViewCell}}}" />
  2. Vanya Pavlova
    Vanya Pavlova avatar
    2019 posts

    Posted 17 Jan 2011 Link to this post

    Hi Roger,

    Since there is no built-in way to achieve this result, you may handle RadGridView's PreparedCellForEdit event to access the default editing element, as shown below:

    private void clubsGrid_PreparedCellForEdit(object sender, GridViewPreparingCellForEditEventArgs e)
     if ((string) e.Column.Header == "Name")
       var tb = e.EditingElement as TextBox;

    Please let me know if you need any further assistance.

    Kind regards,
    Vanya Pavlova
    the Telerik team
    Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
  3. DevCraft R3 2016 release webinar banner
  4. Yungsung
    Yungsung avatar
    2 posts
    Member since:
    Oct 2010

    Posted 21 Jun in reply to Vanya Pavlova Link to this post

    is there a way for wpf mvvm?


  5. Stefan X1
    Stefan X1 avatar
    485 posts

    Posted 22 Jun Link to this post

    Hello Yungsung,

    A possible solution for such requirement is to benefit from the EventToCommandBehavior. Please review the referred help topic for more information.

    Hope this fits your requirements.

    Stefan X1
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Back to Top