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

With the Office2013 style, the row error display is not correct on the first line

5 Answers 86 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Patrick
Top achievements
Rank 2
Iron
Iron
Iron
Patrick asked on 04 Mar 2020, 03:29 PM

Hello,

As you can see in the attached screenshot, the first row has not a top red line.

5 Answers, 1 is accepted

Sort by
0
Vicky
Telerik team
answered on 09 Mar 2020, 11:15 AM

Hi Patrick,

Thanks for the provided screenshot.

The default styles of the GridViewRow and GridViewCells for the Office2013 theme include border elements that have red background applied when they are in the invalid state. Only the GridViewCell element provides a red border brush. The GridViewRow has neither red border brush, nor border thickness by default. Therefore, I guess that you have some customization of the default styles to achieve the look of the screenshot.

I prepared a sample project for you that mimics the provided screenshot. It contains little modifications of the default ControlTemplates of the above mentioned elements, which consist of removing the default red background and providing the needed border setters for the red brush and the thickness. The end result looks like this:


I am attaching the sample project to my reply. It uses the NoXaml version of the dlls and has the Office2013 theme applied.
Please, give it a try and let me know if you find it helpful.

Regards,
Vicky
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Patrick
Top achievements
Rank 2
Iron
Iron
Iron
answered on 09 Mar 2020, 12:35 PM

Hi Vicky,

The GridViewRow has neither red border brush, nor border thickness by default. Therefore, I guess that you have some customization of the default styles to achieve the look of the screenshot.

No I don't have customization on the default style, I've just implemented the INotifyDataErrorInfo on my model and the rows with the lines are those where there are errors.

So the error must be on the default theme of the Telerik's GridView.

0
Vicky
Telerik team
answered on 10 Mar 2020, 02:30 PM

Hi Patrick,

I did some further investigation and here are my findings.

The Data Validation article for the RadGridView includes a note stating that the Telerik.Windows.Data.INotifyDataErrorInfo interface should be used with WPF 4.0, and with WPF 4.5 the System.ComponentModel.INotifyDataErrorInfo is recommended.

I managed to reproduce the described by you behavior using the WPF 4.5 and it seems that the MS Validation is responsible for it. The validation that the RadGridView control implements is designed to have a red background only. Therefore, following the approach that I suggested in my previous reply, you could set the BorderBrush and BorderThickness properties of the corresponding border visual element to achieve the result from my screenshot.

Could you please confirm whether you are using WPF 4.5 and if the desired end result is to indicate the invalid state with red-colored top and bottom borders of the GridViewRow?

I am attaching a sample project which implements the MS INotifyDataErrorInfo interface and uses the Office2013 theme with NoXaml dlls.
Please, give it a try and let me know if it helps. I am looking forward to your reply.

Regards,
Vicky
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Patrick
Top achievements
Rank 2
Iron
Iron
Iron
answered on 11 Mar 2020, 07:32 AM

Hi Vicky,

Could you please confirm whether you are using WPF 4.5
Yes, I'm using WPF 4.5

if the desired end result is to indicate the invalid state with red-colored top and bottom borders of the GridViewRow?
Not really: I had implemeted INotifyDataErrorInfo on the model to check the data and I've seen this behavior in the grid view after that.
The problem we have is that we have many old records in the database and the new application is more strict that the previous one, so it's interesting to see the incorrect old records in the grid view, even if the error is not related to data in a viewable column.
Now, it's just a matter of the first line of the grid view not displayed correctly.

 

Your example uses in-row editing and doesn't let existing entries have errors, which is my case.

0
Vicky
Telerik team
answered on 11 Mar 2020, 11:57 AM

Hello Patrick,

Thank you for the provided updates about the needed information.

If I correctly understand, you need to identify the invalid/incorrect rows, represented by the grid, right on startup.

The provided sample application works with the private fields of the Club class, which means that the setters of the corresponding public properties are not triggered right-away. To trigger the validation as soon as the data is loaded, you need to work with the public properties. For example, if the constructor of the Club class is changed to the following

public Club(string name, DateTime established, int stadiumCapacity)
{
    this.Name = name;
    this.established = established;
    this.stadiumCapacity = stadiumCapacity;
    this.test = "test";
}

and the ObservableCollection of Clubs is changed to

public static ObservableCollection<Club> GetClubs()
{
    ObservableCollection<Club> clubs = new ObservableCollection<Club>();
    Club club;

    // Old invalid
    club = new Club("Old", new DateTime(1886, 1, 1), 60355);
    clubs.Add(club);

    // Liverpool
    club = new Club("Liverpool", new DateTime(1892, 1, 1), 45362);
    clubs.Add(club);

    // Manchester Utd.
    club = new Club("Manchester Utd.", new DateTime(1878, 1, 1), 76212);
    clubs.Add(club);

    // Old invalid
    for (int i = 0; i < 5; i++)
    {
        club = new Club("Old", new DateTime(1886, 1, 1), 60355);
        clubs.Add(club);
    }

    // Chelsea
    club = new Club("Chelsea", new DateTime(1905, 1, 1), 42055);
    clubs.Add(club);

    // Arsenal
    club = new Club("Arsenal", new DateTime(1886, 1, 1), 60355);
    clubs.Add(club);

    // Old invalid
    club = new Club("Old", new DateTime(1886, 1, 1), 60355);
    clubs.Add(club);

    return clubs;
}

then as soon as the application is started, you will get the following result:

You will get the same result also if the Name column is not visible:

Please, try out the above suggestions and let me know if they work for you.

Regards,
Vicky
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
GridView
Asked by
Patrick
Top achievements
Rank 2
Iron
Iron
Iron
Answers by
Vicky
Telerik team
Patrick
Top achievements
Rank 2
Iron
Iron
Iron
Share this question
or