Validation message styling

[Michael]

Hello,

is it possible so validation error on RadMaskedCurrencyInput appears as tool tip and not after the control.

On the attached image desired effect is on the bottom.

[Alex Fidanov]

Hi,

 Yes this is possible. You can set a different validate template. This can be done through the attached property Validation.ErrorTemplate property.

Regards,
Alex Fidanov
the Telerik team

[Michael]

Alex,

Thanks for the reply. I have implemented the solution that you have suggested and that added the tooltip with error message. But another error message is still displayed nex to the control. How to disable it?

[Tina Stancheva]

Hello Michael,

Unfortunately I wasn't able to reproduce the issue. However I feel I might be missing something from your approach and data validation implementation so can you please have a look at the sample I attached and modify it to better demonstrate your scenario. This will allow us to better understand it and suggest a solution.

Greetings,
Tina Stancheva
the Telerik team

[Michael]

Hi Tina,

I have modified the solution to the way the validation is done in our application (we are using IDataErrorInfo interface instead of throwing ValidationExceptions). 
I was able to reproduce the issue I am facing.

As you can see from attached screenshot if enter value greater than $250 into masked box you will get the error displayed next to the control in red.
Also if you hover the control with mouse the tooltip is showng the same error.
 
What we need is to keep the tooltip but get rid of the Error text next to the control. The screen I am working on is too busy and there is simply no space for the validation error.  

Unfortunately I cannot attach the project so I am posting relevant code here:

MainWindow.xaml
 

<Window x:Class="MaskedInput_DataAnnotations.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:MaskedInput_DataAnnotations"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        Title="MainWindow"
        Width="525"
        Height="350">
    <Window.DataContext>
        <local:DataValidationViewModel />
    </Window.DataContext>
    <Window.Resources>
        <Style TargetType="{x:Type telerik:RadMaskedCurrencyInput}">
            <Style.Triggers>
                <Trigger Property="Validation.HasError" Value="true">
                    <Setter Property="ToolTip"  Value="{Binding RelativeSource={RelativeSource Self}, Path=(Validation.Errors)[0].ErrorContent}"/>
                    <Setter Property ="BorderBrush" Value="Red" />

                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <StackPanel>
        <telerik:RadMaskedCurrencyInput x:Name="radMaskedCurrencyInput"
                                        Grid.Row="1"
                                        Width="200"
                                        Margin="10, 10, 10, 0"
                                        InputBehavior="Insert"
                                        Value="{Binding Path=DecimalValue,
                                                        ValidatesOnDataErrors=True,
                                                        ValidatesOnExceptions=True,
                                                        NotifyOnValidationError=True,
                                                        UpdateSourceTrigger=PropertyChanged}" />

    </StackPanel>
</Window>

DataValidationViewModel.cs
using Telerik.Windows.Controls;
using System.ComponentModel;

namespace MaskedInput_DataAnnotations
{
    public class DataValidationViewModel : ViewModelBase, IDataErrorInfo
    {
        private decimal decimalValue;

        public decimal DecimalValue
        {
            get { return decimalValue; }
            set
            {
                decimalValue = value;
                this.OnPropertyChanged("DecimalValue");
            }
        }


        public DataValidationViewModel()
        {
            this.DecimalValue = 100;
        }

        public string Error
        {
            get
            {
                string error = string.Empty;
                if (DecimalValue > 250)
                {
                    error = "Value cannot be greater than 250.";
                }

                return error;
            }
        }

        public string this[string columnName]
        {
            get
            {
                string error = string.Empty;
                switch (columnName)
                {
                    case "DecimalValue":
                        if (DecimalValue > 250)
                        {
                            error = "Value cannot be greater than 250.";
                        }
                        break;
                    default:
                        break;
                }
                return error;
            }
        }
    }
}

[Petar Mladenov]

Hi Michael,

 You can use the Validation.ErrorTemplate  attached property like so:

<telerik:RadMaskedCurrencyInput x:Name="radMaskedCurrencyInput" Grid.Row="1" Validation.ErrorTemplate="{x:Null}"

Please let us know if this is suitable for you.

Kind regards,
Petar Mladenov
the Telerik team

[Michael]

Thanks, Peter, this did the trick!