ToolTip for editable row in GridView with virtualization row

[Michal]

I have a RadGridView in which I have several groups. Each group contains editable rows. A tooltip is bound to these rows via style. Since the binding for tooltip is canceled after an editation, I hardcoded the ToolTip on EndRowEdit event. But this approach only works if a row virtualization is turned off. If I turn the virtualization on and edit a row then each n-th line will display the same tooltip.tak takhle?

Style for binding:

<Style x:Key="rowstyle" TargetType="{x:Type telerik:GridViewRow}" >
           <Setter Property="ToolTip" Value="{Binding Hint}"/>
</Style>

Event:

private void radGridView_RowEditEnded(object sender, GridViewRowEditEndedEventArgs e)
{
        e.Row.ToolTip = (e.Row.DataContext as ConfigurationItemViewModel).Hint;

}

RadGridView:

<telerik:RadGridView DataLoadMode="Asynchronous"  x:Name="radGridView" AutoGenerateColumns="False" ItemsSource="{Binding Options}" GridLinesVisibility="Both" IsFilteringAllowed="True" CanUserSortColumns="False" ShowGroupPanel="False"
                            RowIndicatorVisibility="Collapsed" EnableColumnVirtualization="True" EnableRowVirtualization="True" RowStyle="{StaticResource rowstyle}"  GroupRenderMode="Flat"
                            VerticalGridLinesBrush="{StaticResource MetroGrey03}"
                            HorizontalGridLinesBrush="{StaticResource MetroGrey03}"
                            telerik:RadContextMenu.ContextMenu="{StaticResource FilterContextMenu}"
                            RowEditEnded="radGridView_RowEditEnded"
                            CanUserDeleteRows="False" CanUserInsertRows="False" CanUserResizeRows="False"
                            con:WatermarkBehavior.EmptyGridWatermarkString="{x:Static loc:Resources.EmptyConfigurationGrid}"
                            con:WatermarkBehavior.IsWatermarkEnabled="True" con:WatermarkBehavior.WatermarkString="{x:Static loc:Resources.GridFilterWatermark}" con:WatermarkBehavior.WatermarkStyle="{StaticResource GridWatermarkStyle}"
                            CanUserFreezeColumns="False" EditTriggers="CellClick" RowLoaded="RadGridView_RowLoaded" CanUserSortGroups="False" Loaded="radGridView_Loaded">


           <telerik:RadGridView.Resources>
               <cfg:ValueCellTemplateSelector x:Key="CellEditTemplateSelector">
                   <cfg:ValueCellTemplateSelector.StringValue>
                       <DataTemplate>
                               <TextBox
                                   con:WatermarkBehavior.IsWatermarkEnabled="True" con:WatermarkBehavior.WatermarkString="{x:Static loc:Resources.EnterHere}" con:WatermarkBehavior.WatermarkStyle="{StaticResource WatermarkStyle}"
                                   Width="Auto" HorizontalAlignment="Stretch" Margin="0" Text="{Binding ValueString, ValidatesOnDataErrors=True, UpdateSourceTrigger=PropertyChanged}" MaxLength="{Binding StringMaxLength, Mode=OneWay}"/>
                       </DataTemplate>
                   </cfg:ValueCellTemplateSelector.StringValue>
                   <cfg:ValueCellTemplateSelector.PasswordValue>
                       <DataTemplate>
                           <styles:PasswordBox2N Width="Auto" HorizontalAlignment="Stretch" Margin="0" Password="{Binding Value, ValidatesOnDataErrors=True, Mode=TwoWay}" MaskLenght="8" MaxLenght="16" />
                       </DataTemplate>
                   </cfg:ValueCellTemplateSelector.PasswordValue>
                   <cfg:ValueCellTemplateSelector.IntValue>
                       <DataTemplate>
                           <cfg:CustomRadNumericUpDown Width="Auto" HorizontalAlignment="Stretch" Margin="0" Style="{DynamicResource RadNumericUpDownStyle}" Value="{Binding ValueNr, Mode=TwoWay}" Maximum="{Binding ValueNrMax}" Minimum="{Binding ValueNrMin}" IsInteger="True"/>
                       </DataTemplate>
                   </cfg:ValueCellTemplateSelector.IntValue>
                   <cfg:ValueCellTemplateSelector.DateTimeValue>
                       <DataTemplate>
                           <telerik:RadDateTimePicker Width="Auto" HorizontalAlignment="Stretch" Margin="0" SelectedValue="{Binding ValueDateTime, Mode=TwoWay}" DisplayFormat="Long" />
                       </DataTemplate>
                   </cfg:ValueCellTemplateSelector.DateTimeValue>
                   <cfg:ValueCellTemplateSelector.DateValue>
                       <DataTemplate>
                           <telerik:RadDateTimePicker Width="Auto" HorizontalAlignment="Stretch" Margin="0" SelectedValue="{Binding ValueDateTime, Mode=TwoWay}" InputMode="DatePicker" DisplayFormat="Long" />
                       </DataTemplate>
                   </cfg:ValueCellTemplateSelector.DateValue>
                   <cfg:ValueCellTemplateSelector.TimeValue>
                       <DataTemplate>
                           <telerik:RadDateTimePicker Width="Auto"  HorizontalAlignment="Stretch" Margin="0" SelectedValue="{Binding ValueDateTime, Mode=TwoWay}" InputMode="TimePicker" DisplayFormat="Long"/>
                       </DataTemplate>
                   </cfg:ValueCellTemplateSelector.TimeValue>
                   <cfg:ValueCellTemplateSelector.TimeIntervalValue>
                       <DataTemplate>
                               <Grid HorizontalAlignment="Stretch">
                               <Grid.ColumnDefinitions>
                                   <ColumnDefinition Width="Auto"/>
                                   <ColumnDefinition Width="*"/>
                               </Grid.ColumnDefinitions>
                               <Grid.RowDefinitions>
                                   <RowDefinition Height="Auto"/>
                                   <RowDefinition Height="Auto"/>
                               </Grid.RowDefinitions>
                               <TextBlock Text="{x:Static loc:Resources.From}"  Style="{StaticResource InsideTextBlockStyle}"/>
                               <cfg:CustomRadDateTimePicker Style="{DynamicResource RadDateTimePickerStyle}" Width="Auto" HorizontalAlignment="Stretch" Margin="0" Grid.Column="1"  x:Name="intervalFromPicker" SelectedValue="{Binding ValueIntervalStart, ValidatesOnDataErrors=True}" InputMode="TimePicker" DisplayFormat="Short" />
                               <TextBlock Grid.Row="1"  Style="{StaticResource InsideTextBlockStyle}"  Text="{x:Static loc:Resources.ToDateTime}" />
                               <cfg:CustomRadDateTimePicker Style="{DynamicResource RadDateTimePickerStyle}"  Width="Auto" HorizontalAlignment="Stretch" Margin="0" Grid.Column="1" Grid.Row="1"  x:Name="intervalToPicker" SelectedValue="{Binding ValueIntervalEnd, ValidatesOnDataErrors=True}" InputMode="TimePicker" DisplayFormat="Short" />
                           </Grid>
                       </DataTemplate>
                   </cfg:ValueCellTemplateSelector.TimeIntervalValue>
               </cfg:ValueCellTemplateSelector>
              <cfg:TypeToStringConverter x:Key="typeConverter"/>
           </telerik:RadGridView.Resources>
           <telerik:RadGridView.Columns>
               <telerik:GridViewDataColumn Name="MainGroupName" UniqueName="GroupColumn" IsVisible="False" DataMemberBinding="{Binding Group}" Header="Group" IsReadOnly="True"/>
               <telerik:GridViewDataColumn DataMemberBinding="{Binding Code}" Header="{x:Static loc:Resources.Code}" TextAlignment="Center" IsReadOnly="True">
                   <telerik:GridViewDataColumn.FilteringControl>
                       <con:ContainsFilterControl/>
                   </telerik:GridViewDataColumn.FilteringControl>
               </telerik:GridViewDataColumn>
               <telerik:GridViewDataColumn MinWidth="345" DataMemberBinding="{Binding ColumnName}" Header="{x:Static loc:Resources.Name}" IsReadOnly="True" >
                   <telerik:GridViewDataColumn.FilteringControl>
                       <con:ContainsFilterControl/>
                   </telerik:GridViewDataColumn.FilteringControl>
               </telerik:GridViewDataColumn>
               <telerik:GridViewDataColumn MinWidth="135" DataMemberBinding="{Binding Value, Mode=TwoWay, ValidatesOnDataErrors=False, UpdateSourceTrigger=PropertyChanged}" Header="{x:Static loc:Resources.Value}" CellEditTemplateSelector="{StaticResource CellEditTemplateSelector}" CellTemplateSelector="{StaticResource CellEditTemplateSelector}" />
               <telerik:GridViewDataColumn DataMemberBinding="{Binding Interpr}" IsFilterable="False" Header="{x:Static loc:Resources.Unit}" IsReadOnly="True"  TextAlignment="Center" />
               <telerik:GridViewDataColumn DataMemberBinding="{Binding ValueNrMin}" IsFilterable="False" Header="{x:Static loc:Resources.Min}" IsReadOnly="True"  TextAlignment="Center" />
               <telerik:GridViewDataColumn DataMemberBinding="{Binding ValueNrMax}" IsFilterable="False" Header="{x:Static loc:Resources.Max}" IsReadOnly="True"  TextAlignment="Center" />
               <telerik:GridViewColumn Header="{x:Static loc:Resources.DefaultValue}" IsReadOnly="True"  >
                   <telerik:GridViewColumn.CellTemplate>
                       <DataTemplate>
                           <TextBlock TextAlignment="Center" Visibility="{Binding IsDefaultValueVisible, Converter={StaticResource visToBoolConv}}">
                               <Hyperlink Foreground="{StaticResource MetroYellow03 }" Command="{Binding DefaultCommand}" ToolTip="{x:Static loc:Resources.ResetToDefault}">
                                   <Run>
                                       <Run.Style>
                                           <Style  TargetType="{x:Type Run}">
                                               <Style.Setters>
                                                   <Setter Property="Text" Value="{Binding DefaultValueString, Mode=OneWay}" />

                                               </Style.Setters>
                                               <Style.Triggers>
                                                   <DataTrigger Binding="{Binding DefaultValueString, Mode=OneWay}" Value="">
                                                       <Setter Property="Text" Value="{x:Static loc:Resources.EmptyString}" />
                                                   </DataTrigger>
                                               </Style.Triggers>
                                           </Style>
                                       </Run.Style>
                                   </Run>
                               </Hyperlink>
                           </TextBlock>
                       </DataTemplate>
                   </telerik:GridViewColumn.CellTemplate>
               </telerik:GridViewColumn>
               </telerik:RadGridView.Columns>
           <telerik:RadGridView.GroupDescriptors>
               <telerik:ColumnGroupDescriptor Column="{Binding Columns[\GroupColumn\], ElementName=radGridView}" SortDirection="Ascending" />
           </telerik:RadGridView.GroupDescriptors>
       </telerik:RadGridView>

[Yoan]

Hello Lukáš,

When the virtualization of RadGridView is turned on (which is by default), it is not recommended to work with the visual elements and their properties. The rows and cells are reused and that is why we cannot rely on them.

Generally, you can se a tooltip for GridViewRow like so:

<Style TargetType="telerik:GridViewRow">
            <Setter Property="ToolTipService.ToolTip" Value="MyToolTipText"/>
</Style>

You can check the Add ToolTip for columns and headers help article for a reference.

Regards,
Yoan
Telerik

 

 

[Michal]

Hello Yoan

Thank you for answer, but this me don't help. Can you ask how i can binding ToolTip on editable row, with VirtualizationRow=true?. Thank for any answer

[Yoan]

Hello Lukáš,

As it turns out there is a problem with GridViewRow's ToolTip. It is logged into our Feedback portal as a bug report. You can track its status: here.

Regards,
Yoan
Telerik