how to make GridView Editable.

1 Answer 917 Views
GridView
JIJIKO
Top achievements
Rank 1
Iron
JIJIKO asked on 22 Oct 2021, 07:29 AM

I want to make GridView Editable. But when Cell is blank, i can't enter anything. (If there's data in cell, no problem)

       

I have set IsReadonly=false.

 

btw, i want to change the textbox style in cell when editing data, like the gray borderbrush in pic, where to set the style?

1 Answer, 1 is accepted

Sort by
1
Stenly
Telerik team
answered on 27 Oct 2021, 02:04 PM

Hello Jijiko,

Currently, the default behavior of the RadGridView control is that when, for example, a cell is double-clicked, it can be edited by the user. This behavior can be observed when the cell has data as you have specified. Also, could you specify if any custom templates and styles are used to modify the cells of the data grid?

Regarding the observed behavior, I was only able to reproduce it when the AutoGenerateColumns property was set to False, and an additional GridViewDataColumn was added, without the DataMemberBinding property set. 

<telerik:RadGridView x:Name="gridView" AutoGenerateColumns="False">
    <telerik:RadGridView.Columns>
        <telerik:GridViewDataColumn/>
    </telerik:RadGridView.Columns>
</telerik:RadGridView>

This said if this is not the cause of it, could you modify the attached project so that the observed behavior would also be present in it?

Regarding the styles, you could subscribe to the PreparedCellForEdit event, which allows you to access the currently edited element through the event arguments. A style can be set onto this element, which will be applied when the cell is in edit mode. Regarding the color of the cell border, you could use the ChildrenOfType extension method and get the Border element with Name="BorderVisual" and set the BorderBrush color to the desired one. The following code snippets show a simple style defined in XAML, which is applied to the mentioned editable element, and the logic to change the border's color:

<!--Style to be used onto the edited cell-->
<Style x:Key="textBoxNewStyle" TargetType="TextBox">
    <Setter Property="BorderThickness" Value="3"/>
    <Setter Property="Padding" Value="10"/>
</Style>
private void gridView_PreparedCellForEdit(object sender, GridViewPreparingCellForEditEventArgs e)
{
    if (e.EditingElement is TextBox)
    {
        //Applied the newly defined style to the currently edited textbox 
        ((TextBox)e.EditingElement).Style = Application.Current.MainWindow.Resources["textBoxNewStyle"] as Style;

        //ChildrenOfType to get the BorderVisual Border and change its BorderBrush brush
        ((TextBox)e.EditingElement).ChildrenOfType<Border>().FirstOrDefault(x => x.Name == "BorderVisual").BorderBrush = Brushes.Orange;
    }
}

That said, I have attached the mentioned sample project, that has this approach also implemented.

Regards,
Stenly
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Tags
GridView
Asked by
JIJIKO
Top achievements
Rank 1
Iron
Answers by
Stenly
Telerik team
Share this question
or