C1DatePicker C1ValidationDecorator

Posted by: sebastian-jn.k on 14 July 2022, 10:37 pm EST

  • Posted 14 July 2022, 10:37 pm EST

    hello,
    assembly versions 4.5.20212.747

    C1DatePicker:
    How do i achieve a visible red clue for the user after validation error like my MsDatepicker sample with Validation.ErrorTemplate?
    If i look into the default C1ValidationDecorator template i see a style for the tooltip with red background
    and white foreground but it's looks like the tooltip style is never used. Only the red border is active why?
    Sample attatched.

    greetings from germanyC1DatepickerValidation.zip
  • Replied 17 July 2022, 8:23 pm EST

    Hello Sebestian,

    Thanks for the sample and reporting this issue.

    We have replicated this behavior at our end. This seems like a bug. So, that we have escalated it to the development team. We will get back to you once we have any update from them.[internal Tracking Id - C1XAML-29936]

    Best Regards,
    Nitin
  • Marked as Answer

    Replied 18 July 2022, 4:04 pm EST

    Hi,

    You can show the tooltip on error, by setting the style on C1DatePicker as:


    <Style x:Key="c1datepickerErrorStyle" TargetType="{x:Type c1:C1DatePicker}">
    <Style.Resources> <!-- add tooltip style to DatePicker style resources-->
    <Style TargetType="{x:Type ToolTip}">
    <Setter Property="Background" Value="#FFDC000C"/>
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="Placement" Value="Right"/>
    <Setter Property="Template">
    <Setter.Value>
    <ControlTemplate TargetType="{x:Type ToolTip}">
    <Grid x:Name="Root" Margin="5,0">
    <Border Background="{TemplateBinding Background}" CornerRadius="2">
    <ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}"/>
    </Border>
    </Grid>
    </ControlTemplate>
    </Setter.Value>
    </Setter>
    </Style>
    </Style.Resources>
    <Setter Property="Validation.ErrorTemplate">
    <Setter.Value>
    <ControlTemplate>
    <DockPanel>
    <Border Background="Crimson" CornerRadius="3" DockPanel.Dock="Right">
    <Label
    Padding="3,0,3,0"
    VerticalContentAlignment="Center"
    Content="{Binding AdornedElement.(Validation.Errors)[0].ErrorContent, ElementName=ErrorControl}"
    Height="Auto" Width="Auto" Foreground="SeaShell"
    VerticalAlignment="Center" />
    </Border>
    <AdornedElementPlaceholder x:Name="ErrorControl" />
    </DockPanel>
    </ControlTemplate>
    </Setter.Value>
    </Setter>
    <Style.Triggers>
    <Trigger Property="Validation.HasError" Value="True">
    <Setter Property="VerticalContentAlignment" Value="Center" />
    <Setter Property="ToolTip" Value="{Binding (Validation.Errors)[0].ErrorContent, RelativeSource={RelativeSource Self}}" />
    </Trigger>
    </Style.Triggers>
    </Style>
    ................................
    <c1:C1DatePicker Grid.Row="1" Grid.Column="1" Style="{StaticResource c1datepickerErrorStyle}" >


    Please refer the attached sample for the same : WpfC1DatepickerValidation_Mod.zip

    Best Regards,
    Nitin
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels