CODEWITHSUNDEEP
c#wpf
Nix
Nix

Reputation: 321

WPF datagrid styling errors IDataErrorInfo

I'm using MVVM and have a datagrid with an editable column that I'm doing validation on:

<DataGridTemplateColumn Header="Key" Width="80">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Key}" />
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
                <DataGridTemplateColumn.CellEditingTemplate>
                    <DataTemplate>
                        <vw:NumericTextBox Text="{Binding Key, Mode=TwoWay,ValidatesOnDataErrors=True,UpdateSourceTrigger=PropertyChanged}"/>
                    </DataTemplate>
                </DataGridTemplateColumn.CellEditingTemplate>
            </DataGridTemplateColumn>

I've put a style in to show the error as a tooltip:

<Style TargetType="{x:Type DataGridCell}">
    <Style.Triggers>
        <Trigger Property="Validation.HasError" Value="true">
            <Setter Property="ToolTip" Value="{Binding RelativeSource={x:Static RelativeSource.Self},Path=(Validation.Errors).CurrentItem.ErrorContent}"/>
        </Trigger>
    </Style.Triggers>
</Style>

So the validation is fired and the cell is outlined in red and the error message tooltip is displayed.

I have 2 problems, firstly when the user click out of the cell the cell remains outlined in red but the tooltip isn't displayed when hovered over. How do I get this to work? The second problem is that there is an orange exclamation next to the row which I don't want. I assume this is because of some default styling on the grid or the row. How do I get rid of it (the red outline is fine)?

Upvotes: 3

Views: 3645

Answers (2)

user3065965
user3065965

Reputation:

For the first part - to show error on hover, you need to set tool tip property for TextBlock target type as well. I use below two styles to show error from IDataErrorInfo on datagrid cell edit and also for hover.

<Style x:Key="EditCellStyleError" TargetType="{x:Type TextBox}">
        <Style.Triggers>
            <Trigger Property="Validation.HasError" Value="true">
                <Setter Property="ToolTip" Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}"/>
            </Trigger>
        </Style.Triggers>
    </Style>
    <Style x:Key="CellStyleError" TargetType="{x:Type TextBlock}">
        <Style.Triggers>
            <Trigger Property="Validation.HasError" Value="true">
                <Setter Property="ToolTip" Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}"/>
            </Trigger>
        </Style.Triggers>
    </Style>

set these styles for your datagrid

<DataGridTextColumn .....
EditingElementStyle="{StaticResource EditCellStyleError}" ElementStyle="{StaticResource CellStyleError}"
</DataGridTextColumn>

Upvotes: 2

Eduardo Brites
Eduardo Brites

Reputation: 4786

To remove the exclamation point you've got to edit the datagrid rowsytyle like this:

<DataGrid ...> 
<DataGrid.RowStyle> 
    <Style TargetType="DataGridRow"> 
        <Setter Property="ValidationErrorTemplate" Value="{x:Null}"/> 
    </Style> 
</DataGrid.RowStyle> 
<!-- ... --> 
</DataGrid>

Upvotes: 3

Related Questions