[Solved] RadRadioButton doesn't show ValidationErrors

[Peter]

Dear Telerik,

We use the System.ComponentModel.INotifyDataErrorInfo interface to get our validationerrors to the UI.
Using the standard RadioButton we get our validation on the UI, but when we use RadRadioButton we don't.
Apart from changing RadioButton to telerik:RadRadioButton in the XAML-code, nothing changes.

In the telerik documentation is written that RadRadioButton inherits from RadioButton.
Is it possible that this is a bug in the RadRadioButton control? (for instance not having implemented the invalid visual state)

I have made a small project illustrating the problem.

MainPage

<UserControl x:Class="RadRadioButtonProblem.MainPage"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
             xmlns:my="clr-namespace:RadRadioButtonProblem"
             mc:Ignorable="d" d:DesignHeight="100" d:DesignWidth="700">
    <UserControl.Resources>
        <my:MyViewModel x:Key="MyViewModel"/>
        <my:OrientatieTrueConverter x:Key="OrientatieTrueConverter" />
        <my:OrientatieFalseConverter x:Key="OrientatieFalseConverter" />

    </UserControl.Resources>
    <Grid DataContext="{StaticResource MyViewModel}">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <StackPanel Orientation="Horizontal">
            <telerik:RadRadioButton Margin="0,0,5,0" Width="50" Height="23" CornerRadius="8"
                                    IsChecked="{Binding Path=My, Mode=TwoWay, NotifyOnValidationError=True, ValidatesOnDataErrors=True, Converter={StaticResource OrientatieTrueConverter}}"/>
            <telerik:RadRadioButton Margin="0,0,5,0" Width="50" Height="23" CornerRadius="8"
                                    IsChecked="{Binding Path=My, Mode=TwoWay, NotifyOnValidationError=True, ValidatesOnDataErrors=True, Converter={StaticResource OrientatieFalseConverter}}"/>
        </StackPanel>
        <StackPanel Orientation="Horizontal" Grid.Row="1" Margin="0,10,0,0">
            <RadioButton Margin="0,0,5,0"
                                    IsChecked="{Binding Path=My, Mode=TwoWay, NotifyOnValidationError=True, ValidatesOnDataErrors=True, Converter={StaticResource OrientatieTrueConverter}}"/>
            <RadioButton Margin="0,0,5,0"
                                    IsChecked="{Binding Path=My, Mode=TwoWay, NotifyOnValidationError=True, ValidatesOnDataErrors=True, Converter={StaticResource OrientatieFalseConverter}}"/>
        </StackPanel>

    </Grid>

</UserControl>

ViewModel

public class MyViewModel : INotifyPropertyChanged, INotifyDataErrorInfo
    {
        public event PropertyChangedEventHandler PropertyChanged;

        public MyEnum My
        {
            get { return MyEnum.Unknown; }
        }
        public enum MyEnum
        {
            Unknown,
            True,
            False
        }

        public IEnumerable GetErrors(string propertyName)
        {
            return new[]{"error"};
        }

        public bool HasErrors
        {
            get { return true; }
        }

        public event EventHandler<DataErrorsChangedEventArgs> ErrorsChanged;
    }

Converters

public class OrientatieFalseConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            var orientatieEnum = (MyViewModel.MyEnum)value;
            bool? result;
            switch (orientatieEnum)
            {
                case MyViewModel.MyEnum.True:
                    result = false;
                    break;
                case MyViewModel.MyEnum.False:
                    result = true;
                    break;
                default:
                    result = null;
                    break;
            }
            return result;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            var orientatie = (bool?)value;
            MyViewModel.MyEnum result;
            switch (orientatie)
            {
                case true:
                    result = MyViewModel.MyEnum.False;
                    break;
                case false:
                    result = MyViewModel.MyEnum.True;
                    break;
                default:
                    result = MyViewModel.MyEnum.Unknown;
                    break;
            }
            return result;
        }
    }

public class OrientatieTrueConverter : IValueConverter
    {
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            var orientatieEnum = (MyViewModel.MyEnum)value;
            bool? result;
            switch (orientatieEnum)
            {
                case MyViewModel.MyEnum.True:
                    result = true;
                    break;
                case MyViewModel.MyEnum.False:
                    result = false;
                    break;
                default:
                    result = null;
                    break;
            }
            return result;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            var orientatie = (bool?)value;
            MyViewModel.MyEnum result;
            switch (orientatie)
            {
                case true:
                    result = MyViewModel.MyEnum.True;
                    break;
                case false:
                    result = MyViewModel.MyEnum.False;
                    break;
                default:
                    result = MyViewModel.MyEnum.Unknown;
                    break;
            }
            return result;
        }
    }

[Pavel R. Pavlov]

Hi Peter,

Thank you for contacting us. Unfortunately this behavior is not supported for the moment. However, I logged a feature request in our PITS and you can follow it and vote for it here.

In the meantime you can place a ValidationTooltip control above the RadRadioButton (in one Grid cell) and define your custom error template. Also, you can bind the ValidationTooltip.TooltipPlacementTarget property to the RadRadioButton so that the error template will be visualized next to the target button. In order to hide/show the ValidationTooltip control you will have to bind it's Visibility property to the HasErrors property (through a converter) of your business object. Please take a look at the attached project and let me know if it works for you.

Kind regards,
Pavel R. Pavlov
the Telerik team

[Peter]

Hi Pavel,

Thank you for your workaround.
It does the trick for now (althought it needs alot more code so I hope this feature can get implemented)

Another question about this: we might be converting our application to WPF in the near future (1-2 years from now).
Are these validation errors also not implemented for RadRadioButtons for WPF?

[Pavel R. Pavlov]

Hello Peter,

The RadRadioButtons for WPF also don't support validation out-of-the-box, but the feature request I logged targets the WPF platform as well. And if it gathers enough votes we will discuss its implementation in the future.

Regards,
Pavel R. Pavlov
the Telerik team