Silverlight: Default value in Combobox

Question

I would like to display a default text in the combobox. For example, "Choose a person" message. could you please help me out.

Please note that I am using databinding from domaincontext

Thank you !!

Answer 1

To achieve this, I used a derived ExtendedComboBox class which extends the built-in ComboBox class. You can find the source code of this class in my blog post or below.

After you add this class to your project, you can use this XAML code to display a default value:

<local:ExtendedComboBox ItemsSource="{Binding ...Whatever...}" NotSelectedText="Select item..." />

Also, here is the test page with this control. I think that the second combobox is that what you need.

Full code of this class:

[TemplateVisualState(Name = ExtendedComboBox.StateNormal, GroupName = ExtendedComboBox.GroupItemsSource)]
[TemplateVisualState(Name = ExtendedComboBox.StateNotSelected, GroupName = ExtendedComboBox.GroupItemsSource)]
[TemplateVisualState(Name = ExtendedComboBox.StateEmpty, GroupName = ExtendedComboBox.GroupItemsSource)]
public class ExtendedComboBox : ComboBox
{
    public const string GroupItemsSource = "ItemsSourceStates";
    public const string StateNormal = "Normal";
    public const string StateNotSelected = "NotSelected";
    public const string StateEmpty = "Empty";

    private ContentPresenter selectedContent;

    public ExtendedComboBox()
    {
        this.DefaultStyleKey = typeof(ComboBox);
    }

    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();
        this.selectedContent = this.GetTemplateChild("ContentPresenter") as ContentPresenter;

        // This event can change the NotSelected state
        this.SelectionChanged += (s, e) => this.SetTextIfEmpty();

        // Set a state at start
        this.SetTextIfEmpty();
    }

    // This method can change the Empty state
    protected override void OnItemsChanged(System.Collections.Specialized.NotifyCollectionChangedEventArgs e)
    {
        base.OnItemsChanged(e);
        this.SetTextIfEmpty();
    }

    /// <summary>
    /// Text if the SelectedItem property is null.
    /// </summary>
    public string NotSelectedText
    {
        get { return (string)GetValue(NotSelectedTextProperty); }
        set { SetValue(NotSelectedTextProperty, value); }
    }

    public static readonly DependencyProperty NotSelectedTextProperty =
        DependencyProperty.Register("NotSelectedText", typeof(string), typeof(ExtendedComboBox), new PropertyMetadata(" "));

    /// <summary>
    /// Text if there are no items in the ComboBox at all.
    /// </summary>
    public string EmptyText
    {
        get { return (string)GetValue(EmptyTextProperty); }
        set { SetValue(EmptyTextProperty, value); }
    }

    public static readonly DependencyProperty EmptyTextProperty =
        DependencyProperty.Register("EmptyText", typeof(string), typeof(ExtendedComboBox), new PropertyMetadata(null));

    /// <summary>
    /// Changes the state of this control and updates the displayed text.
    /// </summary>
    protected void SetTextIfEmpty()
    {
        if (this.selectedContent == null || !(this.selectedContent.Content is TextBlock))
            return;
        var text = this.selectedContent.Content as TextBlock;

        if (this.SelectedItem == null && this.Items != null && this.Items.Count > 0)
        {
            text.Text = this.NotSelectedText;
            VisualStateManager.GoToState(this, ExtendedComboBox.StateNotSelected, true);
        }
        else if (this.SelectedItem == null)
        {
            text.Text = this.EmptyText ?? this.NotSelectedText;
            VisualStateManager.GoToState(this, ExtendedComboBox.StateEmpty, true);
        }
        else VisualStateManager.GoToState(this, ExtendedComboBox.StateNormal, true);
    }
}