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

Tooltip in SelectionBoxTemplate

1 Answer 66 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Kalli Kaldi
Top achievements
Rank 1
Kalli Kaldi asked on 25 Apr 2014, 01:35 PM
Hi.

I'm trying to display a Tooltip on a Label within a SelectionBoxTemplate on a ComboBox, like this :

<telerik:RadComboBox Name="cmbBranchInfo" Height="22" VerticalAlignment="Top" Width="202"
                     IsEditable="False" SelectedIndex="0" ClearSelectionButtonVisibility="Visible"
                     ItemsSource="{Binding Path=BranchInfoItems}"
                     DropDownClosed="cmbBranchInfo_DropDownClosed"
                     LostFocus="cmbBranchInfo_LostFocus">
    <telerik:RadComboBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <CheckBox IsChecked="{Binding Checked, Mode=TwoWay}" Content="{Binding BranchInfoDisplayText}"
                          telerik:StyleManager.Theme="Windows8" Click="checkboxBranchId_Click"/>
            </StackPanel>
        </DataTemplate>
    </telerik:RadComboBox.ItemTemplate>
    <telerik:RadComboBox.EmptySelectionBoxTemplate>
        <DataTemplate>
            <telerik:Label Content="Veldu ĂștibĂș" FontStyle="Italic"/>
        </DataTemplate>
    </telerik:RadComboBox.EmptySelectionBoxTemplate>
    <telerik:RadComboBox.ClearSelectionButtonContent>
        <telerik:Label Content="Ekkert val" FontStyle="Italic"/>
    </telerik:RadComboBox.ClearSelectionButtonContent>
    <telerik:RadComboBox.SelectionBoxTemplate>
        <DataTemplate>
            <telerik:Label Content="{Binding Path=DataContext.SelectedBranchesDisplay, RelativeSource={RelativeSource AncestorType=UserControl}}"
                           ToolTipService.ToolTip="Test the Tooltip">
                 
            </telerik:Label>
        </DataTemplate>
    </telerik:RadComboBox.SelectionBoxTemplate>
</telerik:RadComboBox>

I know I can display the Tooltip on the Combobox itself, but what if the SelectionBoxTemplate would be like this (this is from another Combobox) :

<telerik:RadComboBox.SelectionBoxTemplate>
    <DataTemplate>
        <!--<TextBlock Name="statusComboTextBlock"
                Text="{Binding  DataContext.SelectedStatusText, Mode=OneWay, RelativeSource={RelativeSource AncestorType=UserControl}}" />-->
        <StackPanel Orientation="Horizontal" Margin="5,0">
            <telerik:Label Content="StaĂ°a" IsTabStop="False" FontStyle="Italic" />
 
            <ItemsControl HorizontalAlignment="Left" FlowDirection="LeftToRight"
                          ItemsSource="{Binding Path=DataContext.StatusCodesSelected, Mode=OneWay, RelativeSource={RelativeSource AncestorType=UserControl}}" >
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Image Name="selectedStatusImage" Height="20" Width="20" ToolTipService.Placement="Top"
                               Source="{Binding Path=DisplayColor, Converter={StaticResource ColorToStatusIconConverter}}">
                            <ToolTipService.ToolTip>
                                <ToolTip Content="{Binding StatusDescription, RelativeSource={RelativeSource AncestorType=Image}}" BorderThickness="2"/>
                            </ToolTipService.ToolTip>
                        </Image>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
 
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </StackPanel>
    </DataTemplate>
</telerik:RadComboBox.SelectionBoxTemplate>

Here, the Tooltip would be the description for each of the Images in the ItemsControl, depending on the position of the mouse.

Any ideas from you guys ?

Best regards,
Kalli

1 Answer, 1 is accepted

Sort by
0
Konstantina
Telerik team
answered on 28 Apr 2014, 02:47 PM
Hi Karl,

This will not work, as the Label inside the template is not receiving the MouseOver and hence it doesn't show its ToolTip. To make it work you will have to set the ToolTip to the ComboBox. In order to display some data from the business object, you will have to bind it to the SelectedItem. For example:

<telerik:RadComboBox Name="cmbBranchInfo"
                            Height="22"
                            VerticalAlignment="Top"
                            Width="202"
                            IsEditable="False"
                            SelectedIndex="0"
                            DisplayMemberPath="Name"
                            SelectedItem="{Binding SelectedItem, Mode=TwoWay}"
                            telerik:RadToolTipService.ToolTipContent="{Binding SelectedItem.Zip}"
                            ItemsSource="{Binding Agencies}"
                            ClearSelectionButtonVisibility="Visible">
       </telerik:RadComboBox>

Attached I am sending you a sample project illustrating this.
Hope this helps.

Regards,
Konstantina
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
Tags
ComboBox
Asked by
Kalli Kaldi
Top achievements
Rank 1
Answers by
Konstantina
Telerik team
Share this question
or