ComboBox binded to a List of UserControls not showing selected value

Question

I've created in my project the userControl Node that is defined like this:

<UserControl x:Class="ProjectCrow.Node"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:ProjectCrow"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">

<Border Name="border"  BorderBrush="Black" BorderThickness="1">

    <DockPanel LastChildFill="True"  Background="AliceBlue" Height="45" Canvas.Top="90" Width="160" MouseRightButtonDown="OnNodeDeselect" MouseLeftButtonDown="OnNodeClick"   >

        <Border BorderBrush="Black" BorderThickness="1" DockPanel.Dock="Left">
            <Image Name="img"  />
        </Border>


        <Border BorderBrush="Black" BorderThickness="1" DockPanel.Dock="Bottom" Height="10" >
            <TextBlock Name="protocol" VerticalAlignment="Center" Background="Gold"     TextAlignment="Center"  TextWrapping="Wrap"> FFI
            </TextBlock>
        </Border>


        <Border BorderBrush="Black" BorderThickness="1" DockPanel.Dock="Top">
            <TextBlock Name="nodeName"  VerticalAlignment="Center"     TextAlignment="Center"  TextWrapping="Wrap">UNIT
            </TextBlock>
        </Border>

    </DockPanel>
</Border>

I use it many times in my application. Basically it indicates a node, with a defined IP and Port from which you can obtain some data.

I created a combobox that is used by the user to choose which source node to collect data from. I used data binding to get the list of current availables nodes.

        sourcesBox.SetBinding(ComboBox.ItemsSourceProperty, new Binding() { Source = MainUI.mainWindow.sources});
        sourcesBox.DisplayMemberPath = "NameString";
        sourcesBox.SelectedValuePath = "NameString";

Where the MainUI.mainWindow.Sources is public ObservableCollection<Node> sources;

I will leave you also the implementation of my partial Node class

    public partial class Node : UserControl
{

    bool selected = false;

    string name;

    public string NameString
    {
        get { return name; }

        set { if (name != value)
            {
                name = value;
                NotifyPropertyChanged("NameString");
            }
        }
    }


    public virtual event PropertyChangedEventHandler PropertyChanged;
    protected virtual void NotifyPropertyChanged(params string[] propertyNames)
    {
        if (PropertyChanged != null)
        {
            foreach (string propertyName in propertyNames) PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
            PropertyChanged(this, new PropertyChangedEventArgs("HasError"));
        }
    }


    public Node()
    {
        InitializeComponent();
    }

The ComboBox shows correctly all the possible Nodes that currently are available, but if i select something the SelectedValue is not shown.

How can i fix this problem?

This maybe relevant: http://stackoverflow.com/a/2883923/4846465 — Ryan Peters, Jun 16 '16 at 10:04
Do not bind the ComboBox to a collection of UserControls. Instead, bind it to a list of data items (i.e. a class with the relevant properties) and put the UserControl in the ItemTemplate of the ComboBox. Inside the ItemTemplate bind the UserControl's properties to the item properties. Start reading here: [Data Templating Overview](https://msdn.microsoft.com/en-us/library/ms742521(v=vs.100).aspx). — Clemens, Jun 16 '16 at 10:08
Thank you @Clemens.. i did not use DataTemplates however i've created some kind of data class to store my user controls. Now the selected item is shown correctly but the selectedIndex is always -1. What do you think it can be? — Baenor, Jun 16 '16 at 12:08

score 0 · Answer 1 · answered Jul 14 '16 at 14:04

You should be able to bind the selected data object to the ComboBox by using the SelectedValue property (SelectedItem property is read-only, I believe). If this binding MUST be set in code, it can be done like:

ComboBox Box = new ComboBox();
Binding b = new Binding()
{
    Source = YourViewModel, 
    Path = new PropertyPath("YourViewModelProperty"),
    Mode = BindingMode.TwoWay
};
Box.SetBinding(ComboBox.SelectedValueProperty, b);

Or in XAML (my preferred method):

<ComboBox SelectedValue="{Binding YourViewModelProperty, Mode=TwoWay}">
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <!--Your UserControl goes here-->
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

ComboBox binded to a List of UserControls not showing selected value

1 Answers1