How To Change The Backcolor Of Cell When Editing In WPF Datagrid?

Sample date Updated on Jan 04, 2026
background-color customization style styling

This example illustrates how to change the back color of cell when editing in WPF DataGrid (SfDataGrid).

DataGrid does not provide direct support to change the background color of cell when editing. You can change the background color of the cell when editing in DataGrid by customized the editor control TextChanged event based on the corresponding column renderer.


this.dataGrid.CellRenderers.Remove("Numeric");
this.dataGrid.CellRenderers.Add("Numeric", new GridCellNumericRendererExt());

public class GridCellNumericRendererExt : GridCellNumericRenderer
{
    public override void OnInitializeEditElement(DataColumnBase dataColumn, DoubleTextBox uiElement, object dataContext)
    {
        base.OnInitializeEditElement(dataColumn, uiElement, dataContext);
        uiElement.TextChanged += UiElement_TextChanged;
    }

    private void UiElement_TextChanged(object sender, TextChangedEventArgs e)
    {
        var doubleTextBox = (sender as DoubleTextBox);
        //while editing change the condition based on value
        if (doubleTextBox.Text != "0.00")
            doubleTextBox.Background = new SolidColorBrush(Colors.Green);
        else if (doubleTextBox.Text == "0.00")
            doubleTextBox.Background = new SolidColorBrush(Colors.Red);
    }
}

DataGrid provides support for various built-in column types. Each column has its own properties and renderer for more details please refer the below documentation link.

Take a moment to peruse the WPF DataGrid - Column Types documentation, where you can find about DataGrid Column Types with code examples.

Change the background color of cell while editing in SfDataGrid

Note: The background color of cell when editing changed only editor control in SfDataGrid. You need to apply condition based background color for GridCell based on column type

GridCell background is changed using converter, where converter returns the value based on Salary property of underlying record.


<Window.Resources>
        <local:CustomValueConverter x:Key="customValueConverter"/>
</Window.Resources>

<syncfusion:GridNumericColumn  MappingName="Salary" >
                    <syncfusion:GridNumericColumn.CellStyle>
                        <Style TargetType="syncfusion:GridCell">
                            <Setter Property="Background" Value="{Binding Salary, Converter={StaticResource customValueConverter}}" />
                        </Style>
                    </syncfusion:GridNumericColumn.CellStyle>
</syncfusion:GridNumericColumn>

public class CustomValueConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        //while change background color based on condition
        if (value == null || ((value != null) && double.Parse(value.ToString()) == 0))
            return new SolidColorBrush(Colors.Red);
        return new SolidColorBrush(Colors.Green);
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Requirements to run the demo

Visual Studio 2015 and above versions

Up arrow