Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Error Style displayed even if the usercontrol is collapsed/hidden

I've an usercontrol which validate it's content.

I'm using IDataErrorInfo to validate the input(I've to use .Net 3.5).

I'm following this tutorial: http://japikse.blogspot.ch/2009/07/idataerrorinfo-error-templates-and-wpf.html

This mean that I'm using the following style:

<Style TargetType="{x:Type TextBox}">
<Style.Triggers>
    <Trigger Property="Validation.HasError" Value="true">
        <Setter Property="Background" Value="Pink"/>
        <Setter Property="Foreground" Value="Black"/>
    </Trigger>
</Style.Triggers>
<Setter Property="Validation.ErrorTemplate">
    <Setter.Value>
        <ControlTemplate>
            <DockPanel LastChildFill="True" 
               ToolTip="{Binding ElementName=controlWithError,Path=AdornedElement.(Validation.Errors)[0].ErrorContent}">
                <TextBlock DockPanel.Dock="Right" 
                   Foreground="Red"
                   FontSize="14pt" 
                   Margin="-15,0,0,0" FontWeight="Bold">*
                </TextBlock>
                <Border BorderBrush="Red" BorderThickness="1">
                <AdornedElementPlaceholder Name="controlWithError" />
                </Border>
            </DockPanel>
        </ControlTemplate>
    </Setter.Value>
</Setter>

The problem, is that in some case, I've to hide the form(when no element is selected), but when I've a displayed form WITH NO ERROR, and then I collapse the form(a grid), textbox in UserControls(which are invalid since they do not accept null values) got the red border and the asterisk:

enter image description here

The same form when it's not hidden: enter image description here Please note: it's only the content of the ErrorTemplate which is visible, the content of the trigger(background in pink, foreground in black) is not applied.

So I think there is something wrong in this style, but I'm not familiar enough with WPF style to see why.

Another strange things: If I've textbox with this same validation(and not textbox in an user control), they are correctly hidden.

EDIT I found some additional things which help me a lot, first, this topic: Hiding validation adornment when hiding a control With this, I did the following: bind my user control visibility to the hidden element visibility, then in the user control, I bind the textbox visibility to the User control visibility, then(finally), I add a style trigger:

<Style TargetType="{x:Type TextBox}">
        <Style.Triggers>
            <Trigger Property="Validation.HasError" Value="true">
                <Setter Property="Background" Value="Pink"/>
                <Setter Property="Foreground" Value="Black"/>
            </Trigger>
            <Trigger Property="Visibility" Value="Visible">
                <Setter Property="Validation.ErrorTemplate">
                    <Setter.Value>
                        <ControlTemplate>
                            <DockPanel LastChildFill="True" ToolTip="{Binding ElementName=controlWithError,Path=AdornedElement.(Validation.Errors)[0].ErrorContent}" >
                                <TextBlock DockPanel.Dock="Right" Foreground="Red" FontSize="14pt" Margin="-15,0,0,0" FontWeight="Bold">*</TextBlock>
                                <Border BorderBrush="Red" BorderThickness="1">
                                    <AdornedElementPlaceholder Name="controlWithError" />
                                </Border>
                            </DockPanel>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>
</Style>

It works almost!, the only thing left is a small red dot, which comes from nowhere enter image description here

Any idea from where it comes?

like image 368
J4N Avatar asked Nov 04 '22 10:11

J4N


1 Answers

I found a workaround, it's maybe not the best way(be if you have a better way, just tell me!).

So first, when I use my usercontrol, I bind it's visibility to the usercontrol I'm going to hide:

<userContols:BrowseFileControl  Visibility="{Binding ElementName=uxFormGrid, Path=Visibility}"/>

Secondly, int the IDataErrorInfo method(public string this[string columnName]), I only return an error IF the current controls is shown.

    public string this[string columnName]
    {
        get
        {
            String result=null;
            if (Visibility == Visibility.Visible)
            {
                if (columnName == "FilePath")
                {
                    if (String.IsNullOrEmpty(FilePath))
                    {
                        if (!CanBeEmpty)
                        {
                            result = "Mandatory field";
                        }
                    }
                    else if (!IsValidFilePath(FilePath))
                    {
                        result = "Malformed path";
                    }
                }
            }
            return result;
        }
    }

I would like prefer to work on the styles, but I didn't found a way to fully remove any red mark.

like image 132
J4N Avatar answered Jan 04 '23 13:01

J4N