Color cells based on errors

Hi, i need a help to understand how can i colorize rows and cells based on some data.

The  problem is that i have a sfDataGrid and i passed data from a DataTable (and here is everything ok), now i have a custom structure that tell me the errors in the datatable (rowIndex, columnIndex, description and gravity of the error) and i need to colore every row that have an error with one color and for every cell with an error i need to set that cell with a specific color based on the gravity of the error (example: row with an error with yellow background, but for example cell 3 have an error that require red background and cell number 5 an error that require blue background, every other cell in the wrong row remain yellow, and if the row doesn't have errors have to remain with default style)


I instantiate everything via code runtime because i have multiple items to create and i can't know how they are until i import them.


Thanks and hope for a help


6 Replies

SB Sweatha Bharathi Syncfusion Team July 7, 2023 10:21 AM UTC

Massimo Cicognani ,


To achieve your requirement of colorizing rows and cells based on some data in the SfDataGrid, you can utilize conditional styling. The SfDataGrid provides support for conditional styling through various methods:

1. Styling using a converter: You can define a converter that takes the data as input and returns the appropriate style or color based on the specified conditions.

2. Styling based on the record using a converter: Similar to the previous method, you can use a converter to examine the record's properties and determine the appropriate style or color.

3. Styling using a style selector: With a style selector, you can define different styles or colors based on specific criteria, such as data values or record properties.

UG Link : https://help.syncfusion.com/wpf/datagrid/conditional-styling

Reference Image :



Note : In WPF DataGrid, styling the cells takes higher priority than styling the entire row.


We have provided a sample for your reference using a style selector. Please review the sample and verify if it meets your requirements. If we have misunderstood your requirement kindly share the details about details on how you define the error , please share that information with us. This will help us proceed further and provide a solution as quickly as possible.






Attachment: DataGridWithDataTable_6be71b29.zip


MC Massimo Cicognani July 7, 2023 12:17 PM UTC

Thanks, only two things:

1) I don't create sfDataGrid via XAML but via code for project requirements

2) The element that give me the gravity to colorize the cells and rows is not into the datatable, Datatable only give me the data, those error specifics are in a separated object


If you can recreate the example project with those details will be perfect


P.S.

I'll write you the error class to explain better what it is

Foreach datatable i have a list of this DataTableErrors to know where the errors are and what is th


public class DataTableErrors

    {

        public int row;

        public int column;

        public ErrorGravity errorGravity;

        public string errorDescription;


        public DataTableErrors()

        {

            row = -1;

            column = -1;

            errorGravity = ErrorGravity.None;

            errorDescription = string.Empty;

        }


        public DataTableErrors(int row, int column, ErrorGravity errorGravity, string errorDescription)

        {

            this.row = row;

            this.column = column;

            this.errorGravity = errorGravity;

            this.errorDescription = errorDescription;

        }

    }


    public enum ErrorGravity

    {

        None,

        Info,

        Warning,

        Error,

    }



SP Sreemon Premkumar Muthukrishnan Syncfusion Team July 10, 2023 04:38 PM UTC

Hi Massimo Cicognani,

We have checked your requirement with the provided details, but we are little unclear about what you are trying to do with the DataTableError class. Could you please provide the below details which will be helpful for us to implement your requirement.

  1. Can you please share any code  to describe how the DataTableError class was related to the SfDataGrid?
  2. Can you please share the image reference for your requirement?
  3. Based on the provided details, Are you trying to set the DataTableError objects list to ItemSource of the SfDataGrid to colorize the rows and cells ?

please provide more information regarding the requirement. This would help us to proceed further.

Regards,

Sreemon Premkumar M.



MC Massimo Cicognani July 11, 2023 07:13 AM UTC

Hello, (1) DataTableError is related to the sfDataGrid only with the cell coords that are the DataTable cells coords (the DataTable is the ItemSource i passed to the sfDataGrid), but it is not passed to the sfDataGrid, i used the ErrorList only to discover where my errors are.


Searching on the web, after thousands of sites and forums i find a way to do that, the only problem is that if i change column order or i sort the data, the color are connected to the cell and i don't know how to reorder the style with the data

[

public override Style SelectStyle(object item, DependencyObject container)

        {

            GridCell cell = container as GridCell;

            bool hasError = false;

            foreach (DataTableErrors error in errors)

            {

                if (cell.ColumnBase.RowIndex == error.row + 1)

                {

                    if (error.errorGravity == ErrorGravity.Error || error.errorGravity == ErrorGravity.Warning)

                        hasError = true;


                    if(cell.ColumnBase.ColumnIndex == error.column)

                    {

                        switch (error.errorGravity)

                        {

                            case ErrorGravity.Error:

                                return AnalyzedData.errorStyle;


                            case ErrorGravity.Warning:

                                return AnalyzedData.warningStyle;


                            case ErrorGravity.Info:

                                return AnalyzedData.infoStyle;

                        }

                    }

                }

            }


            if(hasError)

                //se sono in una riga con errori ma la cella non ne ha evidenzio semplicemente la cella

                return AnalyzedData.highlightStyle;


            return base.SelectStyle(item, container);

        }

]

This is what i have done


And this is what happened if i sort data 



SP Sreemon Premkumar Muthukrishnan Syncfusion Team July 12, 2023 06:21 PM UTC

Hi Massimo Cicognani,

We are currently preparing the sample based on the provided information. We will need two business days to validate it and will update you with further details on or before July 14, 2023. We appreciate your patience until then.

Regards,

Sreemon Premkumar M.



SB Sweatha Bharathi Syncfusion Team July 14, 2023 12:32 PM UTC

Massimo Cicognani ,


After analyzing the provided code, we noticed that you have assigned static values to the row and column indexes. This means that when sorting is applied, the styling will only be applied to those specific indexes. Using static indexes in this way is not the correct approach.

To resolve this issue, we recommend defining the error based on the data values rather than relying on static indexes. By considering the actual data values, you can ensure that the styling is applied correctly regardless of the sorting or any other changes.

For a better understanding, we have example code snippet below. Additionally, we have provided a video for your reference.


Code Snippet:


  if (gravityOfError == "Error" && ((container as GridCell).ColumnBase.GridColumn.MappingName == "GravityOfError"))

                {

                    return App.Current.Resources["CellStyle1"] as Style;

                }

             



Attachment: Video_7f2f408a.zip

Loader.
Up arrow icon