This is a migrated thread and some comments may be shown as answers.

Validation Tooltip incorrect message and style

2 Answers 115 Views

ComboBox

This is a migrated thread and some comments may be shown as answers.

Lance asked on 12 Apr 2011, 08:58 AM

CorrectValidationStyleAndMessage.gif

ComboBoxValidationError.gif

Hi,

I have a databound RadComboBox in my Silverlight 4 application. When there is a data error it correctly has a red border but when you hover on it, the validation tooltip message is just the name of the object the combo is bound to and not the error message (see comboboxvalidationerror.gif for screen print). I am using 2011_1_328 version of the RadControls. Below is my xaml definition of the control:

<telerik:RadComboBox Grid.Column="1" Grid.Row="10" x:Name="cboIndustries" IsFilteringEnabled="True" TextSearchMode="StartsWith" Width="250" DisplayMemberPath="IndustryName" HorizontalAlignment="Left" SelectedItem=

"{Binding Path=IndustryId, Mode=TwoWay, Converter={StaticResource industryConverter}, NotifyOnValidationError=True, ValidatesOnDataErrors=True, ValidatesOnExceptions=True}"

Margin="0,2,0,2" />

I have some Microsoft Silverlight comboxboxes that are working correctly (see correctvalidationstyleandmessage.gif for screen print). Please can you help me get the correct error message to appear in the RadComboBox validation tooltip and also could you help me so the style of this message is like the error message for the Microsoft Silverlight comboxbox in the screenprint mentioned above?

Thanks

2 Answers, 1 is accepted

answered on 15 Apr 2011, 06:26 AM

Hi,

I managed to get the red style for the validation tooltip but I still can't get the correct error message to come through. Come on Telerik, please give me some help on this.

My ValidationTooltip.xaml:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:telerikInput="clr-namespace:Telerik.Windows.Controls"

xmlns:telerikChromes="clr-namespace:Telerik.Windows.Controls.Chromes;assembly=Telerik.Windows.Controls"

xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"

xmlns:sys="clr-namespace:System;assembly=mscorlib">

<SolidColorBrush x:Key="ValidationInnerTick" Color="#FFCB576E" />

<SolidColorBrush x:Key="ValidationOuterTick" Color="#FFFFFFFF" />

<LinearGradientBrush x:Key="ValidationTooltipBackground" EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFF424C" Offset="1"/>

<GradientStop Color="#FFC92931"/>

</LinearGradientBrush>

<SolidColorBrush x:Key="ValidationTooltipOuterBorder" Color="#FFDC000C" />

<CornerRadius x:Key="ValidationTooltipCornerRadius">1</CornerRadius>

<SolidColorBrush x:Key="ValidationTooltipInnerBorder" Color="#FFFFFFFF" />

<SolidColorBrush x:Key="ValidationTooltipForeground" Color="White" />

<CornerRadius x:Key="SplitButton_SpanCornerRadius">1</CornerRadius>

<SolidColorBrush x:Key="ValidationOuterBorder" Color="#FFCB576E" />

<ControlTemplate x:Key="ErrorTooltipTemplate" TargetType="ToolTip">

<Grid x:Name="RootVisual" Margin="5 0" RenderTransformOrigin="0 0" Opacity="0">

<vsm:VisualStateManager.VisualStateGroups>

<vsm:VisualStateGroup Name="OpenStates">

<vsm:VisualStateGroup.Transitions>

<vsm:VisualTransition GeneratedDuration="0" />

<vsm:VisualTransition To="Open" GeneratedDuration="0:0:0.2">

<Storyboard>

<DoubleAnimation Storyboard.TargetName="xform" Storyboard.TargetProperty="X" To="0" Duration="0:0:0.2">

<DoubleAnimation.EasingFunction>

<BackEase Amplitude=".3" EasingMode="EaseOut" />

</DoubleAnimation.EasingFunction>

</DoubleAnimation>

<DoubleAnimation Storyboard.TargetName="RootVisual" Storyboard.TargetProperty="Opacity" To="1" Duration="0:0:0.2" />

</Storyboard>

</vsm:VisualTransition>

</vsm:VisualStateGroup.Transitions>

<vsm:VisualState x:Name="Closed">

<Storyboard>

<DoubleAnimation Storyboard.TargetName="RootVisual" Storyboard.TargetProperty="Opacity" To="0" Duration="0" />

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="Open">

<Storyboard>

<DoubleAnimation Storyboard.TargetName="xform" Storyboard.TargetProperty="X" To="0" Duration="0" />

<DoubleAnimation Storyboard.TargetName="RootVisual" Storyboard.TargetProperty="Opacity" To="1" Duration="0" />

</Storyboard>

</vsm:VisualState>

</vsm:VisualStateGroup>

</vsm:VisualStateManager.VisualStateGroups>

<Grid.RenderTransform>

<TranslateTransform x:Name="xform" X="-25" />

</Grid.RenderTransform>

<Border Margin="4,4,-4,-4" Background="#052A2E31" CornerRadius="5" />

<Border Margin="3,3,-3,-3" Background="#152A2E31" CornerRadius="4" />

<Border Margin="2,2,-2,-2" Background="#252A2E31" CornerRadius="3" />

<Border Margin="1,1,-1,-1" Background="#352A2E31" CornerRadius="2" />

<Border Background="#FFDC000C" CornerRadius="2">

<TextBlock UseLayoutRounding="false" Foreground="White" MaxWidth="250" TextWrapping="Wrap" Text="{Binding (Validation.Errors).CurrentItem.ErrorContent}" />

</Border>

<ContentPresenter Margin="8,2,8,2" Height="{Binding Path=Height, RelativeSource={RelativeSource TemplatedParent}}"/>

</Grid>

</ControlTemplate>

<ControlTemplate x:Key="RadValidationTooltipTemplate" TargetType="telerikChromes:ValidationTooltip">

<Grid x:Name="VisualRoot">

<Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" IsHitTestVisible="False" />

<Path Data="M2,1 L6,1 6,5 Z" Fill="{StaticResource ValidationInnerTick}" Width="7" Height="7" HorizontalAlignment="Right" VerticalAlignment="Top" />

<Path Data="M0,0 L2,0 7,5 7,7 Z" Fill="{StaticResource ValidationOuterTick}" Width="7" Height="7" HorizontalAlignment="Right" VerticalAlignment="Top" />

<Path x:Name="InvisibleHitArea" Data="M0,0 9,0 9,9 8,9 0,1 Z" Fill="Blue" Opacity="0" Margin="-1" Width="9" Height="9" HorizontalAlignment="Right" VerticalAlignment="Top" />

<ToolTipService.ToolTip>

<ToolTip x:Name="PART_ToolTip" Template="{StaticResource ErrorTooltipTemplate}" Foreground="White" Placement="Right" PlacementTarget="{TemplateBinding TooltipPlacementTarget}">

<Border Background="{StaticResource ValidationTooltipBackground}" BorderBrush="{StaticResource ValidationTooltipOuterBorder}" BorderThickness="1" CornerRadius="{StaticResource ValidationTooltipCornerRadius}">

<Border BorderBrush="{StaticResource ValidationTooltipInnerBorder}" BorderThickness="1">

<ContentPresenter Content="{TemplateBinding TooltipContent}" ContentTemplate="{TemplateBinding TooltipContentTemplate}" />

</Border>

<ToolTip.Triggers>

<EventTrigger RoutedEvent="Canvas.Loaded">

<EventTrigger.Actions>

<BeginStoryboard>

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_ToolTip" Storyboard.TargetProperty="IsHitTestVisible">

<DiscreteObjectKeyFrame KeyTime="0">

<DiscreteObjectKeyFrame.Value>

<sys:Boolean>true</sys:Boolean>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</BeginStoryboard>

</EventTrigger.Actions>

</EventTrigger>

</ToolTip.Triggers>

</ToolTip>

</ToolTipService.ToolTip>

</Grid>

</ControlTemplate>

<DataTemplate x:Key="TooltipContentTemplate">

<TextBlock MaxWidth="1000" Foreground="White" TextWrapping="Wrap" Text="{Binding (Validation.Errors)[0].ErrorContent}" />

</DataTemplate>

<Style TargetType="telerikChromes:ValidationTooltip">

<Setter Property="IsTabStop" Value="False" />

<Setter Property="CornerRadius" Value="{StaticResource SplitButton_SpanCornerRadius}" />

<Setter Property="BorderThickness" Value="1" />

<Setter Property="BorderBrush" Value="{StaticResource ValidationOuterBorder}" />

<Setter Property="Template" Value="{StaticResource RadValidationTooltipTemplate}" />

<Setter Property="TooltipContentTemplate" Value="{StaticResource TooltipContentTemplate}" />

</Style>

</ResourceDictionary>

My ComboBox.xaml:

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"

xmlns:sys="clr-namespace:System;assembly=mscorlib"

xmlns:vsm="clr-namespace:System.Windows;assembly=System.Windows"

xmlns:telerikChromes="clr-namespace:Telerik.Windows.Controls.Chromes;assembly=Telerik.Windows.Controls"

xmlns:telerikPrimitives="clr-namespace:Telerik.Windows.Controls.Primitives;assembly=Telerik.Windows.Controls"

xmlns:primitives="clr-namespace:Telerik.Windows.Controls.Primitives;assembly=Telerik.Windows.Controls"

xmlns:animation="clr-namespace:Telerik.Windows.Controls.Animation;assembly=Telerik.Windows.Controls"

xmlns:telerikInput="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input"

xmlns:calendar="clr-namespace:Telerik.Windows.Controls.Calendar;assembly=Telerik.Windows.Controls.Input"

xmlns:telerikMaskedTextBox="clr-namespace:Telerik.Windows.Controls.MaskedTextBox;assembly=Telerik.Windows.Controls.Input"

xmlns:telerikMaskedInput="clr-namespace:Telerik.Windows.Controls.MaskedInput;assembly=Telerik.Windows.Controls.Input"

xmlns:telerikRating="clr-namespace:Telerik.Windows.Controls.Rating;assembly=Telerik.Windows.Controls.Input">

<SolidColorBrush x:Key="ControlOuterBorder_Disabled" Color="#FF989898" />

<SolidColorBrush x:Key="PickerForeground_Disabled" Color="#FF8D8D8D" />

<SolidColorBrush x:Key="ButtonIconForeground_Disabled" Color="#FF8D8D8D" />

<SolidColorBrush x:Key="ButtonIconBackground_Disabled" Color="#FFFFFFFF" />

<SolidColorBrush x:Key="ControlBackground_Disabled" Color="#FFE0E0E0" />

<SolidColorBrush x:Key="ButtonIconForeground_MouseOver" Color="#FF000000" />

<SolidColorBrush x:Key="ButtonIconBackground_MouseOver" Color="#FFFFFFFF" />

<LinearGradientBrush x:Key="ControlOuterBorder_Pressed" EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FF282828"/>

<GradientStop Color="#FF5F5F5F" Offset="1"/>

</LinearGradientBrush>

<SolidColorBrush x:Key="ButtonIconForeground_Pressed" Color="#FF000000" />

<SolidColorBrush x:Key="ButtonIconBackground_Pressed" Color="#FFFFFFFF" />

<SolidColorBrush x:Key="PickerBackground_Normal" Color="#FFFFFFFF" />

<CornerRadius x:Key="SplitButton_LeftPartCornerRadius">1 0 0 1</CornerRadius>

<CornerRadius x:Key="SplitButton_SpanCornerRadius">1</CornerRadius>

<SolidColorBrush x:Key="ControlOuterBorder_MouseOver" Color="#FFFFC92B" />

<telerik:Office_BlackTheme x:Key="Theme" />

<SolidColorBrush x:Key="ControlOuterBorder_Focused" Color="#FFFFC92B" />

<SolidColorBrush x:Key="ControlInnerBorder_Focused" Color="Transparent" />

<CornerRadius x:Key="SplitButton_SpanInnerCornerRadius">0</CornerRadius>

<CornerRadius x:Key="SplitButton_RightPartCornerRadius">0 1 1 0</CornerRadius>

<SolidColorBrush x:Key="ButtonIconForeground_Normal" Color="#FF000000" />

<SolidColorBrush x:Key="ButtonIconBackground_Normal" Color="#FFFFFFFF" />

<ControlTemplate x:Key="ArrowTemplateEditableCombobox" TargetType="ContentControl">

<Grid Margin="5 0">

<Path x:Name="BackgroundIcon" Data="M0,0 L2,0 1,1 Z" Stretch="Fill" Width="5" Height="3" Fill="{TemplateBinding Background}" Margin="0 2 0 0" />

<Path x:Name="ForegroundIcon" Data="M0,0 L2,0 1,1 Z" Stretch="Fill" Width="5" Height="3" Fill="{TemplateBinding Foreground}" Margin="0 1 0 1" />

</Grid>

</ControlTemplate>

<SolidColorBrush x:Key="PickerPopupBackground" Color="#FFFFFFFF" />

<ControlTemplate x:Key="ArrowTemplateNonEditableCombobox" TargetType="ContentControl">

<Grid Margin="5 0">

<Path x:Name="BackgroundIcon" Data="M0,0 L2,0 1,1 Z" Stretch="Fill" Width="5" Height="3" Fill="{TemplateBinding Background}" Margin="0 2 0 0" />

<Path x:Name="ForegroundIcon" Data="M0,0 L2,0 1,1 Z" Stretch="Fill" Width="5" Height="3" Fill="{TemplateBinding Foreground}" Margin="0 1 0 1" />

</Grid>

</ControlTemplate>

<SolidColorBrush x:Key="ControlOuterBorder_Highlighted" Color="#FFFFC92B" />

<LinearGradientBrush x:Key="ControlBackground_Highlighted" EndPoint="0.5,1" StartPoint="0.5,0">

<GradientStop Color="#FFFFFBDA" Offset="0"/>

<GradientStop Color="#FFFFFBA3" Offset="1"/>

</LinearGradientBrush>

<SolidColorBrush x:Key="ControlInnerBorder_Highlighted" Color="#FFFFFFFF" />

<SolidColorBrush x:Key="PickerForeground_Normal" Color="#FF000000" />

<SolidColorBrush x:Key="ControlOuterBorder_Normal" Color="#FF848484" />

<ControlTemplate x:Key="EditableComboBox" TargetType="telerikInput:RadComboBox">

<Grid x:Name="VisualRoot">

<vsm:VisualStateManager.VisualStateGroups>

<vsm:VisualStateGroup x:Name="CommonStates">

<vsm:VisualState x:Name="Disabled">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="BorderBrush">

<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{StaticResource ControlOuterBorder_Disabled}" />

</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual" Storyboard.TargetProperty="Opacity">

<LinearDoubleKeyFrame KeyTime="0:0:0.050" Value="0" />

</DoubleAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0.050">

<DiscreteObjectKeyFrame.Value>

<Visibility>Collapsed</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonChrome" Storyboard.TargetProperty="RenderEnabled">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<sys:Boolean>False</sys:Boolean>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_EditableTextBox" Storyboard.TargetProperty="Foreground">

<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{StaticResource PickerForeground_Disabled}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Foreground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconForeground_Disabled}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Background">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconBackground_Disabled}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="Background">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ControlBackground_Disabled}" />

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="Normal">

<Storyboard>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual" Storyboard.TargetProperty="Opacity">

<LinearDoubleKeyFrame KeyTime="0:0:0.150" Value="0" />

</DoubleAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0.150">

<DiscreteObjectKeyFrame.Value>

<Visibility>Collapsed</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="MouseOver">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonChrome" Storyboard.TargetProperty="RenderActive">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<sys:Boolean>True</sys:Boolean>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual" Storyboard.TargetProperty="Opacity">

<LinearDoubleKeyFrame KeyTime="0:0:0.115" Value="1" />

</DoubleAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Foreground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconForeground_MouseOver}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Background">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconBackground_MouseOver}" />

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="DropDownOpen">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="BorderBrush">

<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{StaticResource ControlOuterBorder_Pressed}" />

</ObjectAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual" Storyboard.TargetProperty="Opacity">

<LinearDoubleKeyFrame KeyTime="0:0:0.050" Value="0" />

</DoubleAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="MouseOverVisual" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0.050">

<DiscreteObjectKeyFrame.Value>

<Visibility>Collapsed</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisual" Storyboard.TargetProperty="Opacity">

<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="0" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Foreground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconForeground_Pressed}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Background">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconBackground_Pressed}" />

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

</vsm:VisualStateGroup>

<vsm:VisualStateGroup x:Name="FocusStates">

<vsm:VisualState x:Name="Focused">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonChrome"

Storyboard.TargetProperty="RenderFocused">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<sys:Boolean>True</sys:Boolean>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusVisual"

Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="Unfocused" />

</vsm:VisualStateGroup>

<vsm:VisualStateGroup x:Name="ValidationStates">

<vsm:VisualState x:Name="Valid">

</vsm:VisualState>

<vsm:VisualState x:Name="InvalidUnfocused">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationTooltip"

Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="InvalidFocused">

<Storyboard>

<ObjectAnimationUsingKeyFrames

Storyboard.TargetName="ValidationTooltip"

Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames

Storyboard.TargetName="ValidationTooltip"

Storyboard.TargetProperty="IsOpen">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<sys:Boolean>True</sys:Boolean>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

</vsm:VisualStateGroup>

<vsm:VisualStateGroup x:Name="WatermarkStates">

<vsm:VisualState x:Name="WatermarkVisible">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="Watermark" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="WatermarkInvisible" />

</vsm:VisualStateGroup>

</vsm:VisualStateManager.VisualStateGroups>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="*" />

<ColumnDefinition Width="Auto" />

</Grid.ColumnDefinitions>

<Border x:Name="Background" Grid.Column="0" IsHitTestVisible="False" Background="{StaticResource PickerBackground_Normal}" CornerRadius="{StaticResource SplitButton_LeftPartCornerRadius}" />

<Border Grid.ColumnSpan="2" IsHitTestVisible="False" Background="{TemplateBinding Background}" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}" />

<Border x:Name="Border" Grid.ColumnSpan="2" IsHitTestVisible="False" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}" />

<Border x:Name="MouseOverVisual" Grid.ColumnSpan="2" IsHitTestVisible="False" BorderBrush="{StaticResource ControlOuterBorder_MouseOver}" BorderThickness="{TemplateBinding BorderThickness}" Opacity="0" Visibility="Collapsed" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}" />

<telerik:PickerTextBox x:Name="PART_EditableTextBox"

Grid.Column="0"

BorderThickness="{TemplateBinding BorderThickness}"

Padding="{TemplateBinding Padding}"

Background="{TemplateBinding Background}"

HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"

VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"

IsReadOnly="{TemplateBinding IsReadOnly}"

telerik:StyleManager.Theme="{StaticResource Theme}" />

<Border x:Name="FocusVisual" Visibility="Collapsed" Grid.ColumnSpan="2" IsHitTestVisible="False" BorderBrush="{StaticResource ControlOuterBorder_Focused}" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}" BorderThickness="{TemplateBinding BorderThickness}" >

<Border BorderBrush="{StaticResource ControlInnerBorder_Focused}" CornerRadius="{StaticResource SplitButton_SpanInnerCornerRadius}" BorderThickness="{TemplateBinding BorderThickness}" />

</Border>

<telerik:RadToggleButton x:Name="PART_DropDownButton" Margin="0" Padding="0"

Grid.Column="1" IsTabStop="False" ClickMode="Press" telerik:StyleManager.Theme="{StaticResource Theme}">

<telerik:RadToggleButton.Template>

<ControlTemplate TargetType="telerik:RadToggleButton">

<ContentPresenter />

</ControlTemplate>

</telerik:RadToggleButton.Template>

<Grid>

<telerikChromes:ButtonChrome x:Name="ButtonChrome"

telerik:StyleManager.Theme="{StaticResource Theme}"

BorderBrush="{TemplateBinding BorderBrush}"

BorderThickness="{TemplateBinding BorderThickness}"

RenderPressed="{TemplateBinding IsDropDownOpen}"

RenderMouseOver="{Binding IsMouseOver, ElementName=PART_DropDownButton}"

CornerRadius="{StaticResource SplitButton_RightPartCornerRadius}"

RenderFocused="{TemplateBinding IsFocused}"

/>

<ContentControl x:Name="DropDownIcon"

Grid.Column="1" IsTabStop="False"

Foreground="{StaticResource ButtonIconForeground_Normal}"

Background="{StaticResource ButtonIconBackground_Normal}"

Template="{StaticResource ArrowTemplateEditableCombobox}" />

</Grid>

</telerik:RadToggleButton>

<TextBlock x:Name="Watermark" Text="{TemplateBinding EmptyText}" Opacity=".5" IsHitTestVisible="False"

VerticalAlignment="Center" HorizontalAlignment="Left" Margin="5,0,0,0" Visibility="Collapsed" />

<telerikChromes:ValidationTooltip x:Name="ValidationTooltip"

Grid.ColumnSpan="2" Visibility="Collapsed"

telerik:StyleManager.Theme="{StaticResource Theme}"

TooltipPlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}" TooltipContent="{Binding Path=(Validation.Errors), RelativeSource={RelativeSource TemplatedParent}}">

</telerikChromes:ValidationTooltip>

<telerikPrimitives:Popup Owner="{Binding RelativeSource={RelativeSource TemplatedParent}}" CloseOnOutsideClick="True"

IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}">

<Grid x:Name="PopupRoot">

<telerikChromes:ShadowChrome telerik:StyleManager.Theme="{StaticResource Theme}" Margin="0 0 0 3" />

<Border BorderThickness="{TemplateBinding BorderThickness}"

BorderBrush="{TemplateBinding BorderBrush}"

MinWidth="{TemplateBinding MinDropDownWidth}"

MaxHeight="{TemplateBinding MaxDropDownHeight}"

Background="{StaticResource PickerPopupBackground}"

CornerRadius="{StaticResource SplitButton_SpanCornerRadius}"

Margin="0 0 0 3"

>

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="Auto" />

<RowDefinition Height="*" />

</Grid.RowDefinitions>

<telerik:RadButton x:Name="PART_ClearButton" Grid.Row="0"

Margin="-1 -1 -1 0"

Visibility="{TemplateBinding ClearSelectionButtonVisibility}"

Content="{TemplateBinding ClearSelectionButtonContent}"

telerik:StyleManager.Theme="{StaticResource Theme}" />

<ScrollViewer x:Name="PART_ScrollViewer" Grid.Row="1"

Padding="0 1 0 0" BorderThickness="0"

VerticalScrollBarVisibility="Auto"

telerik:StyleManager.Theme="{StaticResource Theme}"

telerik:ScrollViewerExtensions.EnableMouseWheel="True"

>

<ItemsPresenter />

</ScrollViewer>

</Grid>

</Border>

</Grid>

</telerikPrimitives:Popup>

</Grid>

</ControlTemplate>

<ControlTemplate x:Key="NonEditableComboBox" TargetType="telerikInput:RadComboBox">

<Grid x:Name="VisualRoot">

<vsm:VisualStateManager.VisualStateGroups>

<vsm:VisualStateGroup x:Name="CommonStates">

<vsm:VisualState x:Name="Disabled">

<Storyboard>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="Opacity">

<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.5" />

</DoubleAnimationUsingKeyFrames>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Opacity">

<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.5" />

</DoubleAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Foreground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconForeground_Disabled}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Background">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconBackground_Disabled}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonChrome" Storyboard.TargetProperty="RenderEnabled">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<sys:Boolean>False</sys:Boolean>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="Normal" />

<vsm:VisualState x:Name="MouseOver">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ButtonChrome" Storyboard.TargetProperty="RenderMouseOver">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<sys:Boolean>True</sys:Boolean>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Foreground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconForeground_MouseOver}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Background">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconBackground_MouseOver}" />

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="DropDownOpen">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Foreground">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconForeground_Pressed}" />

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Background">

<DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonIconBackground_Pressed}" />

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

</vsm:VisualStateGroup>

<vsm:VisualStateGroup x:Name="FocusStates">

<vsm:VisualState x:Name="Focused" />

<vsm:VisualState x:Name="Unfocused" />

</vsm:VisualStateGroup>

<vsm:VisualStateGroup x:Name="ValidationStates">

<vsm:VisualState x:Name="Valid">

</vsm:VisualState>

<vsm:VisualState x:Name="InvalidUnfocused">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationTooltip"

Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

<vsm:VisualState x:Name="InvalidFocused">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationTooltip" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<Visibility>Visible</Visibility>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ValidationTooltip" Storyboard.TargetProperty="IsOpen">

<DiscreteObjectKeyFrame KeyTime="0:0:0">

<DiscreteObjectKeyFrame.Value>

<sys:Boolean>True</sys:Boolean>

</DiscreteObjectKeyFrame.Value>

</DiscreteObjectKeyFrame>

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</vsm:VisualState>

</vsm:VisualStateGroup>

</vsm:VisualStateManager.VisualStateGroups>

<Border IsHitTestVisible="False" Background="{TemplateBinding Background}" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}" />

<telerik:RadToggleButton x:Name="PART_DropDownButton" IsTabStop="False" Margin="0" Padding="0" ClickMode="Press" telerik:StyleManager.Theme="{StaticResource Theme}">

<telerik:RadToggleButton.Template>

<ControlTemplate TargetType="telerik:RadToggleButton">

<ContentPresenter />

</ControlTemplate>

</telerik:RadToggleButton.Template>

<Grid>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="*" />

<ColumnDefinition Width="Auto" />

</Grid.ColumnDefinitions>

<telerikChromes:ButtonChrome x:Name="ButtonChrome"

Grid.ColumnSpan="2"

telerik:StyleManager.Theme="{StaticResource Theme}"

CornerRadius="{StaticResource SplitButton_SpanCornerRadius}"

BorderBrush="{TemplateBinding BorderBrush}"

BorderThickness="{TemplateBinding BorderThickness}"

RenderPressed="{TemplateBinding IsDropDownOpen}"

RenderFocused="{TemplateBinding IsFocused}"

/>

<ContentControl x:Name="DropDownIcon"

Grid.Column="1" IsTabStop="False"

Foreground="{StaticResource ButtonIconForeground_Normal}"

Background="{StaticResource ButtonIconBackground_Normal}"

Template="{StaticResource ArrowTemplateNonEditableCombobox}" />

<ContentPresenter x:Name="Content"

Grid.Column="0"

Margin="{TemplateBinding Padding}"

IsHitTestVisible="False"

Content="{TemplateBinding SelectionBoxItem}"

ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"

HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />

</Grid>

</telerik:RadToggleButton>

<telerikChromes:ValidationTooltip x:Name="ValidationTooltip"

Visibility="Collapsed"

telerik:StyleManager.Theme="{StaticResource Theme}"

TooltipPlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}" TooltipContent="{Binding Path=(Validation.Errors), RelativeSource={RelativeSource TemplatedParent}}">

</telerikChromes:ValidationTooltip>

<telerikPrimitives:Popup Owner="{Binding RelativeSource={RelativeSource TemplatedParent}}" CloseOnOutsideClick="True" IsOpen="{Binding IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}">

<Grid x:Name="PopupRoot">

<telerikChromes:ShadowChrome telerik:StyleManager.Theme="{StaticResource Theme}" Margin="0 0 0 3" />

<Border BorderThickness="{TemplateBinding BorderThickness}"

BorderBrush="{TemplateBinding BorderBrush}"

MinWidth="{TemplateBinding MinDropDownWidth}"

MaxHeight="{TemplateBinding MaxDropDownHeight}"

Background="{StaticResource PickerPopupBackground}"

CornerRadius="{StaticResource SplitButton_SpanCornerRadius}"

Margin="0 0 0 3" >

<Grid>

<Grid.RowDefinitions>

<RowDefinition Height="Auto" />

<RowDefinition Height="*" />

</Grid.RowDefinitions>

<telerik:RadButton x:Name="PART_ClearButton" Grid.Row="0" Margin="-1 -1 -1 0" Visibility="{TemplateBinding ClearSelectionButtonVisibility}" Content="{TemplateBinding ClearSelectionButtonContent}" telerik:StyleManager.Theme="{StaticResource Theme}" />

<ScrollViewer x:Name="PART_ScrollViewer" Grid.Row="1" Padding="0 1 0 0" BorderThickness="0" VerticalScrollBarVisibility="Auto" telerik:StyleManager.Theme="{StaticResource Theme}" telerik:ScrollViewerExtensions.EnableMouseWheel="True" >

<ItemsPresenter />

</ScrollViewer>

</Grid>

</Border>

</Grid>

</telerikPrimitives:Popup>

</Grid>

</ControlTemplate>

<Style TargetType="telerikInput:RadComboBoxItem" >

<Setter Property="MinHeight" Value="19" />

<Setter Property="Margin" Value="0 -1 0 0" />

<Setter Property="BorderThickness" Value="1" />

<Setter Property="BorderBrush" Value="Transparent" />

<Setter Property="Background" Value="Transparent" />

<Setter Property="Padding" Value="3 2" />

<Setter Property="HorizontalContentAlignment" Value="Stretch" />

<Setter Property="VerticalContentAlignment" Value="Center" />

<Setter Property="Template">

<Setter.Value>

<ControlTemplate TargetType="telerikInput:RadComboBoxItem">

<Border BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}">

<vsm:VisualStateManager.VisualStateGroups>

<VisualStateGroup x:Name="CommonStates">

<VisualState x:Name="Normal" />

<VisualState x:Name="MouseOver">

<Storyboard>

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="HighlightVisual" Storyboard.TargetProperty="Visibility">

<DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible" />

</ObjectAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

<VisualState x:Name="Disabled">

<Storyboard>

<DoubleAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="Opacity">

<DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.33" />

</DoubleAnimationUsingKeyFrames>

</Storyboard>

</VisualState>

</VisualStateGroup>

</vsm:VisualStateManager.VisualStateGroups>

<Grid>

<Border x:Name="HighlightVisual" Visibility="Collapsed" CornerRadius="{StaticResource SplitButton_SpanCornerRadius}" BorderThickness="1" BorderBrush="{StaticResource ControlOuterBorder_Highlighted}" Background="{StaticResource ControlBackground_Highlighted}">

<Border BorderThickness="1" CornerRadius="{StaticResource SplitButton_SpanInnerCornerRadius}" BorderBrush="{StaticResource ControlInnerBorder_Highlighted}" />

</Border>

<ContentPresenter x:Name="Content" Margin="{TemplateBinding Padding}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />

</Grid>

</Border>

</ControlTemplate>

</Setter.Value>

</Setter>

</Style>

<Style TargetType="telerikInput:RadComboBox">

<Setter Property="Template" Value="{StaticResource NonEditableComboBox}" />

<Setter Property="EditableTemplate" Value="{StaticResource EditableComboBox}" />

<Setter Property="NonEditableTemplate" Value="{StaticResource NonEditableComboBox}" />

<Setter Property="HorizontalContentAlignment" Value="Stretch" />

<Setter Property="VerticalContentAlignment" Value="Center" />

<Setter Property="MinHeight" Value="22" />

<Setter Property="Padding" Value="5 0" />

<Setter Property="Foreground" Value="{StaticResource PickerForeground_Normal}" />

<Setter Property="Background" Value="Transparent" />

<Setter Property="BorderBrush" Value="{StaticResource ControlOuterBorder_Normal}" />

<Setter Property="BorderThickness" Value="1" />

<Setter Property="UseLayoutRounding" Value="True" />

<Setter Property="animation:AnimationManager.AnimationSelector">

<Setter.Value>

<animation:AnimationSelector>

<animation:AnimationGroup AnimationName="Expand">

<animation:SlideAnimation Direction="In" SlideMode="Top" TargetElementName="PopupRoot" />

</animation:AnimationGroup>

<animation:AnimationGroup AnimationName="Collapse">

<animation:SlideAnimation Direction="Out" SlideMode="Top" TargetElementName="PopupRoot" />

</animation:AnimationGroup>

</animation:AnimationSelector>

</Setter.Value>

</Setter>

</Style>

</ResourceDictionary>

answered on 15 Apr 2011, 09:43 AM

Hi,

Remove the telerik:StyleManager.Theme="{StaticResource Theme}" from the telerikChromes:ValidationTooltip that is placed in the RadComboBox's ControlTempalte. Note that there are 2 ControlsTemplate for RadComboBox so you have to edit them both.

Add an x:Key on the ValidationTooltip's implicit style and move all resources for the ValidationTooltip in the RadComboBox's dictionary. Note that resources with duplicated x:Key should not be added.

After that set the Style on the RadComboBox to be the Style of the ValidationTooltip (use {StaticResource } with the same name you set for x:Key)

In the TooltipContentTemplate adjust the binding so that it displays a proper error. You can alter the binding or add an additional property to the Path.

Also RadComboBox should (but it obviously does not) behave like the microsoft's combobox validation. Can you share with us how do you use validation in your project. It would be really helpful for us to reproduce this issue so we can fix it and provide consistent behavior.

Regards,
Pana
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items