CODEWITHSUNDEEP
wpfxaml
Emad Gabriel
Emad Gabriel

Reputation: 3707

WPF Combobox Validation.ErrorTemplate error

I have a combobox that i need to edit its error template to show a red border when there is a validation error.

I am using the following style

<Style TargetType="{x:Type ComboBox}" >
    <Setter Property="Validation.ErrorTemplate">
        <Setter.Value>
            <ControlTemplate>
                <DockPanel>
                    <Border BorderBrush="Red" BorderThickness="3">
                        <AdornedElementPlaceholder />
                    </Border>
                </DockPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="FontFamily" Value="Segoe UI" />
    <Setter Property="FontSize" Value="12" />
    <Setter Property="VerticalAlignment" Value="Center" />
</Style>

The border never shows up when validation errors occur. Any tips what is going wrong?

Upvotes: 4

Views: 13382

Answers (5)

Andy
Andy

Reputation: 91

I searched around some more and came up with a solution based on another article here: WPF - How to apply style to AdornedElementPlaceholder's AdornedElement?

<!-- This works -->
<ComboBox Name="comboBox1" Style="{StaticResource NewComboBoxStyle}" Validation.ErrorTemplate="{StaticResource comboBoxValidationTemplate}" />

<SolidColorBrush x:Key="MainBorderBrush">#FF91B3FF</SolidColorBrush>

<Style x:Key="NewComboBoxStyle" TargetType="{x:Type ComboBox}" BasedOn="{StaticResource myErrorTemplate}">
    <Setter Property="BorderBrush" Value="{DynamicResource MainBorderBrush}" />
    <Style.Triggers>
        <Trigger Property="Validation.HasError" Value="True">
            <Setter Property="BorderBrush" Value="Blue" />
        </Trigger>
    </Style.Triggers>
</Style>

<!-- Sets ToolTip when Validation.HasError is True. -->
<Style TargetType="Control" x:Key="myErrorTemplate">
    <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>

<ControlTemplate x:Key="comboBoxValidationTemplate">
    <DockPanel Name="myDockPanel">
        <AdornedElementPlaceholder/>
        <TextBlock Text="*" FontWeight="Bold" FontSize="14" Foreground="Red" DockPanel.Dock="Left" ToolTip="{Binding .CurrentItem}" />
    </DockPanel>
</ControlTemplate>

Upvotes: 0

Andy
Andy

Reputation: 91

I don't like any of the responses here. Simply put, how do you change the border color for the error template for a ComboBox using Blend or not? It shouldn't be acceptable to draw another border around the existing border of the ComboBox. I've figured out how to creat a ControlTemplate in Blend but not a Validation Template.

I've come close with trying to make it appear like I've changed the actual border color, but that's not what I actually want. Suggestions? To complicate it a bit, I'd like to display a red asterisk outside of the right border of the control.

The following code is a close attempt, but it is actually drawing a border inside the ComboBox and if you look close, you can see that the border is 2 pixels wide when combined with the ComboBox border:

<DockPanel Name="myDockPanel">
        <AdornedElementPlaceholder>
            <Border BorderBrush="Blue" BorderThickness="1" CornerRadius="2" />
        </AdornedElementPlaceholder>
        <TextBlock Text="*" FontWeight="Bold" FontSize="14" Foreground="Red" DockPanel.Dock="Left"  ToolTip="{Binding .CurrentItem}" />
    </DockPanel>

Upvotes: 1

Clovis Coli Jr
Clovis Coli Jr

Reputation: 11

Use This.

    <Style x:Key="textBoxStyle" TargetType="{x:Type telerik:RadMaskedTextBox}">
        <Style.Triggers>
            <Trigger Property="Validation.HasError" Value="True">
                <Setter Property="ToolTip" Value="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=(Validation.Errors)[0].ErrorContent}"/>
                <Setter Property="Control.BorderBrush" Value="Red" />
            </Trigger>
        </Style.Triggers>
    </Style>

Upvotes: 1

TomBot
TomBot

Reputation: 1146

The Style you posted works. You should check your binding, did you add ValidatesOnDataErrors=True and ValidatesOnExceptions=True to the binding of SelectedValue?

Upvotes: 5

Francesco Abbruzzese
Francesco Abbruzzese

Reputation: 4149

enter code heretry without the dock panel, that is uneuseful since it wraps jus one element. However, sicnecerely I don't wnow if it makes sense to wrap a textbox with a border, since it has already a border! You should try to change directly the colour of its border. You could try to use again the panel but then put the border around the panel ie:

Border BorderBrush="Red" BorderThickness="3"
   DockPanel
      AdornedElement

This makes more sense because the wrap panel has not its own border.

Upvotes: 1

Related Questions