Add a Validation message to UWP DataGrid

Question

question

Allanjb asked Oct 9, '21 Allanjb commented Oct 26, '21

Add a Validation message to UWP DataGrid

I am developing an App that utilizes the UWP DataGrid control.
The control handles validation by turning the background red for scenarios where I have implemented INotifyDataErrorInfo, GetErrors(), HasErrors() and the ErrorsChanged event handler. This level of Validation is built into the control.
The problem with this is that the control does not display the error message returned by GetErrors().
I would like to display the error message below the Cell that has the error similar to what I can do in WPF.
I cannot find a solution anywhere for doing this.

windows-uwp

· 2

5 |1600 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

RoyLi-MSFT · Oct 11, 2021 at 02:16 AM

First of all, are you developing a UWP app? If it is, I'm confused about display the error message returned by GetErrors(). How do you display these messages? Could you please share the code snippet about what you are doing?

0 ·

Allanjb RoyLi-MSFT · Oct 11, 2021 at 03:24 AM

Yes, this is for a UWP app. I have shared some demo code with you through GitHub.
Basically if you enter a Customer Last Name of "Smith", DataGrid will change the row background to Red. This is the standard validation response for DataGrid.
The GerErrors() method adds an error message to the errors list which I want to show below the cell that contains the error.
Sounds simple but I cannot find a good example out there to use as a starting point.
Here is the GitHub location for the demo app:
DataGridValidationDemo

0 ·

Answer 1 · 2021-10-11T08:42:42.12Z

RoyLi-MSFT answered Oct 11, '21 Allanjb commented Oct 26, '21

Hello,

Welcome to Microsoft Q&A!

I want to show below the cell that contains the error.

First of all, the community toolkit DataGrid is different from the DataGrid in WPF. The Input Validation in the community toolkit DataGrid will only change the background row. You could also check this behavior in the official document: Input Validation.

For your scenario, I'd suggest you might need to custom the RowDetailsTemplate which could be used to display the error message. You could follow the document here: Display and Configure Row Details in the DataGrid Control. What you need to do is to create a DataTemplate that defines the appearance of the row details section first. Then place the DataTemplate inside the <DataGrid.RowDetailsTemplate> tags.

The code looks like this:

 <controls:DataGrid>
    <controls:DataGrid.RowDetailsTemplate>
       <DataTemplate>
          <StackPanel Margin="20,10" Padding="5" Spacing="3">
             <TextBlock Margin="20" Text="Error messages"/>   
          </StackPanel>
       </DataTemplate>
    </controls:DataGrid.RowDetailsTemplate>
 </controls:DataGrid>

You could also try to submit a feature request in the Community Toolkit GitHub Issue about this.

Thank you.

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

· 1

5 |1600 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Allanjb · Oct 26, 2021 at 12:25 AM

Have also asked the question in the Windows Community Toolkit group Q&A on GitHub. See where that takes me.

0 ·

question