Binding a Windows Forms ComboBox in C#

Most often when reading the selected item of a bound combobox you will need more information than just the selected text or the selected index of the combo. For example, if you have a combobox bound to a user table in your database, you will most probably want to have the full user name displayed in the combobox, but when a user is selected you will want to work with the user code or user id. In this case the combo’s selected index is of no use and neither is the display text. You need a way to be able to retrieve the user code when a user is selected.

Fortunately, this is quite easy to accomplish. All we need to do is bind our combobox to a list of KeyValuePair objects. In this article I am going to show you how to do exactly that.

To start off create a form which looks similar to the below one:

Now in the Form_Load event handler we must add the following code:

private void MainForm_Load(object sender, EventArgs e)
{
    // Create a List to store our KeyValuePairs
    List<KeyValuePair<string, string>> data = new List<KeyValuePair<string, string>>();

    // Add data to the List
    data.Add(new KeyValuePair<string, string>("p1", "Joe"));
    data.Add(new KeyValuePair<string, string>("p2", "David"));
    data.Add(new KeyValuePair<string, string>("p3", "Keith"));
    data.Add(new KeyValuePair<string, string>("p4", "Andrew"));
    data.Add(new KeyValuePair<string, string>("p5", "Maria"));
    
    // Clear the combobox
    cboData.DataSource = null;
    cboData.Items.Clear();

    // Bind the combobox
    cboData.DataSource = new BindingSource(data, null);
    cboData.DisplayMember = "Value";
    cboData.ValueMember = "Key";
}

In the first line of code we are creating a List object to store our KeyValuePair objects. The KeyValuePair class can be very useful since it allows you to create a pair of objects of any type, one of which is the key and the other is the value. What this means is that you can have an object of type string paired with a key of type integer for example. Or you could have a value of type MyClass with a key of type string. The combinations are limitless.

As you can see in the code, we are creating a KeyValuePair where both the key and the value are strings. We are then adding data to the List object by creating KeyValuePair instances and adding them to our List. Next we are clearing the combobox as a precaution (just in case it was populated with something already), and finally we are binding the combobox to the List.

The last two lines of the above code are critical for your binding to work correctly. We must tell the combo which is the DisplayMember and which is the ValueMember of our KeyValuePair so that it will know which object from the pair to display and which to use as the key.

Once you have created the above code run your project and you will see that the combobox is populated with the above names. The key value however cannot be seen, so let’s create some code to visually see the selected key.

Subscribe to the SelectedIndexChanged event of your combobox and add the following code:

private void cboData_SelectedIndexChanged(object sender, EventArgs e)
{
    // Get the selected item in the combobox
    KeyValuePair<string, string> selectedPair = (KeyValuePair<string, string>)cboData.SelectedItem;
    
    // Show selected information on screen
    lblSelectedKey.Text = selectedPair.Key;
    lblSelectedValue.Text = selectedPair.Value;
}

What we are doing here is retrieving the combo’s selected item and converting it to a KeyValuePair object. Then from our KeyValuePair object we are accessing the Key and the Value properties and assigning them to the labels on our form.

Now if you run the application again you should have something like the following, and as you can see the key and value are being displayed in our labels.

Now using this technique you can easily bind a combobox and have one value displayed while another value is used as your key.

I hope you found this useful.
Dave.

Tagged as: Binding, ComboBox, KeyValuePair, Windows Forms