Geek Answers Handbook

Custom validation error pattern does not comply with ZIndex

I have a view defined as a DataTemplate (for "OrderEntryViewModel") using the menu, ContentPresenter and Expander inside a three-row grid. The content of the ContentPresenter is bound to another ViewModel "OrderViewModel" (for which there is another view defined by the DataTemplate). The extender has ZIndex 99, so when it extends UP, it expands on top of any other controls (i.e. ContentPresenter).

This works as expected. EXCEPT, when ContentPresenter (OrderViewModel) content has data errors ... My OrderView displays its own validation error pattern around controls with invalid data. What happens when I expand the expander, all the controls inside the ContentPresenter are closed, but the red frame and the exclamation mark that I show are still visible through the expander! I checked that my ZIndex expander is 99 and ContentPresenter is 0. Can someone help me with this?

Here are some images to help explain:

The first image shows what the views look like when NOT expanding.

The second image shows how the looks look when I expand.

I define a validation error pattern as follows:

<ControlTemplate x:Key="ValidationErrorTemplate"> <DockPanel LastChildFill="true"> <Border Background="Red" DockPanel.Dock="right" Margin="5,0,0,0" Width="10" Height="10" CornerRadius="5" ToolTip="{Binding AdornedElement.(Validation.Errors).CurrentItem.ErrorContent, ElementName=customAdorner}"> <TextBlock Text="!" VerticalAlignment="center" HorizontalAlignment="center" FontWeight="Bold" Foreground="White"/> </Border> <AdornedElementPlaceholder x:Name="customAdorner" VerticalAlignment="Center"> <Border BorderBrush="red" BorderThickness="1" /> </AdornedElementPlaceholder> </DockPanel> </ControlTemplate>

And assign it to a specific control (this is how I do it for my TextBox):

 <Style TargetType="{x:Type TextBox}" x:Key="ValidatedStyleTextBox"> <Style.Triggers> <DataTrigger Binding="{Binding IsLocked}" Value="True"> <Setter Property="Validation.ErrorTemplate" Value="{x:Null}"/> </DataTrigger> <DataTrigger Binding="{Binding IsLocked}" Value="False"> <Setter Property="Validation.ErrorTemplate" Value="{StaticResource ValidationErrorTemplate}"/> </DataTrigger> </Style.Triggers> </Style>
+1
source share
1 answer

This solution worked for me ... just added AdornerDecorator at the same level as my expander, so now the controls inside AdornerDecorator use this layer to display instead of the top level layer in the window

+1
source

More articles:


All Articles