Element Binding Silverlight 3

Question

I trying to use Element Binding in Silverlight 3 to SelectedItem of ComboBox in ToolTipService.ToolTip. This code works:

<ComboBox x:Name="cboSource" DisplayMemberPath="Name" ToolTipService.ToolTip="{Binding ElementName=cboSource, Path=SelectedItem.Name}" Width="180" />

but this code doesn't:

<ComboBox x:Name="cboSource" DisplayMemberPath="Name" Width="180" >
    <ToolTipService.ToolTip>
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding ElementName=cboSource, Path=SelectedItem.Code}" Margin="0,0,5,0"/>
            <TextBlock Text="-" Margin="0,0,5,0"/>
            <TextBlock Text="{Binding ElementName=cboSource, Path=SelectedItem.Name}"/>
        </StackPanel>
    </ToolTipService.ToolTip>
</ComboBox>

Name and Code are properties of item in cboSource.ItemsSource. In first code, the Name is correctly displayed in combo's tooltip but in second code tooltip is " - ". Any ideas ?

Answer 1

A very simple way could be to define an additional property in the source object something

whenever a user hovers the mouse over the control, the concatenated string will be shown as a nice simple tooltip.

like this:

using System...
....


public Class Employee
{
  public string Forenames {get;set;}
  public string Surname {get;set;}
  public string Address {get;set;}
  private string tooltip;
  public string Tooltip 
  {
   get{return tooltip;}
   set
   {
    value=Forenames + " " + Surname + "," Address ;
   }
}
//... other methods to follow
}


XAML MyPage.cs code has following 

public partial Class MyPage : Page
{
Public List<Employee> Employees{get;set;}
public MyPage()
{
 InitiazeComponents();
 Employees = new List<Employee>(); // initialise
 Employees=GetEmployees();
}

public List<Employee> GetEmployees(){
.. 
 Write code that ..returns
..
}
.. other code to follow..
}

Now in MyPage.xaml

...

<ComboBox Grid.Column="1" Grid.Row="1" Height="23" HorizontalAlignment="Left" Margin="8,4,0,0" Name="cboCostCentreInvestor" ItemsSource="{Binding Employees}" ToolTipService.ToolTip="{Binding ElementName=cboCostCentreInvestor,Path=SelectedItem.Tooltip}">
                        <ComboBox.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal" Style="{StaticResource stackPanelComboboxItemStyle}">
                                    <TextBlock Text="{Binding Forenames}" Style="{StaticResource textBlockComboboxItem}" />
                                    <TextBlock Text="{Binding Surname}" Style="{StaticResource textBlockComboboxItem}" />                                
                                </StackPanel>
                            </DataTemplate>
                        </ComboBox.ItemTemplate>


                </ComboBox>

Answer 2

Ahh...fun with tooltips.

The ToolTipService is actually "rooted" at the base of the tree (if you have Mole, you can double check to verify this) - hence, it does not get it's DataContext propagated down from parent elements.

I've done hacky things to fix this behavior in the past, but they all boil down to "Code up an attached property that accepts a DataContext and forwards it along to the attached element".

Best of luck - this thing has stung me a couple of times. :)

Ooh, found a link for you: http://www.codeproject.com/Articles/36078/Silverlight-2-0-How-to-use-a-DataBinding-with-the-ToolTipService.aspx

EDIT: Try this out:

        <ComboBox x:Name="cboSource" DisplayMemberPath="Name" Width="180">
        <local:DataBindingTooltip.TooltipDataContext>
            <Binding ElementName="cboSource"/>
        </local:DataBindingTooltip.TooltipDataContext>
        <local:DataBindingTooltip.Tooltip>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Path=SelectedItem.Code}" Margin="0,0,5,0"/>
                    <TextBlock Text="-" Margin="0,0,5,0"/>
                    <TextBlock Text="{Binding Path=SelectedItem.Name}"/>
                </StackPanel>
        </local:DataBindingTooltip.Tooltip>
    </ComboBox>

With the following class:

    public class DataBindingTooltip
{
    public static readonly DependencyProperty TooltipDataContextProperty =
        DependencyProperty.RegisterAttached(
            "TooltipDataContext",
            typeof (object),
            typeof (DataBindingTooltip),
            null);

    public static readonly DependencyProperty TooltipProperty = 
        DependencyProperty.RegisterAttached(
            "Tooltip", 
            typeof(object), 
            typeof(DataBindingTooltip), 
            new PropertyMetadata(TooltipChanged));

    public static void SetTooltip(DependencyObject d, object value)
    {
        d.SetValue(TooltipProperty, value);
    }
    public static object GetTooltip(DependencyObject d)
    {
        return d.GetValue(TooltipProperty);
    }

    public static void SetTooltipDataContext(DependencyObject d, object value)
    {
        d.SetValue(TooltipDataContextProperty, value);
    }
    public static object GetTooltipDataContext(DependencyObject d)
    {
        return d.GetValue(TooltipDataContextProperty);
    }

    private static void TooltipChanged(DependencyObject sender,
        DependencyPropertyChangedEventArgs e)
    {
        if (sender is FrameworkElement)
        {
            var element = sender as FrameworkElement;
            element.Loaded += ElementLoaded;
        }

    }

    static void ElementLoaded(object sender, RoutedEventArgs e)
    {
        if (sender is FrameworkElement)
        {
            var element = sender as FrameworkElement;
            element.Loaded -= ElementLoaded;

            var tooltip = element.GetValue(TooltipProperty) as DependencyObject;
            if (tooltip != null)
            {
                if (GetTooltipDataContext(element) != null)
                {
                    tooltip.SetValue(FrameworkElement.DataContextProperty,
                                     element.GetValue(TooltipDataContextProperty));
                }
                else
                {
                    tooltip.SetValue(FrameworkElement.DataContextProperty,
                                     element.GetValue(FrameworkElement.DataContextProperty));
                }
            }
            ToolTipService.SetToolTip(element, tooltip);
        }
    }
}