.NET datagrid is a graphical user interface component that presents a tabular view of data. .NET datagrid supports the following common interface features:

Clicking a column header to implement grid sorting
Dragging column headers to change their size
In-cell editing of shown data
Row and column separators, and alternating row background colors

Datagrid's cells can be presented as some different control types (textbox, button, date/time picker etc.) within datagrid interface layout. However much important control is combobox that could be placed in datagrid with the following functionalities:

When the DataGrid cell in the column is edited, it displays a dropdown combobox control within the cell bounds. When not being edited, the cell displays the selected value.

Applications that use the column style class can bind a combobox class member to any DataTable object. By setting the DisplayMember and ValueMember combobox properties, the application can define which DataTable column contains descriptions to display and which column contains a corresponding identifier to return to the DataGrid control.

Sometimes it is necessary to have a multi column in-cell combobox where end-user will be able to edit and select referenced data.

Rustemsoft DataGridComboBoxColumnStyle class contains a private combobox member and a read-only property to access it. The class constructor has several event handlers to receive notifications, for example, when focus leaves the datagrid combobox.

The DataGridColumnStyle contains combobox for a DataGrid on your .Net form. It is not just a dropdown combobox, which appears when a datagrid cell becomes the current cell. This .Net DataGrid DataGridColumnStyle combobox control has the following attractive features:

This combobox DataGridColumnStyle automatically fills the text at the cursor with the value of its dropdown values list. As characters are typed, the component finds the closest matching item from the list and automatically fills in the remaining characters. Appended characters are highlighted so that they are replaced by any further typing. For this auto-filling feature you can setup the character case sensibility.

This DataGridColumnStyle gives you ability to instantly update dropdown values with a really simple and friendly user interface. When you click the additional dropdown button of the combo a dictionary of its list values will be displayed below the combo. You can update values, and insert and delete rows in the dictionary grid.

The control gives an ability to get a nesting combo box that filters values from a related child table. In a dictionary grid, you can view and edit related data in a child table. In your database a Master table has a one-to-many relationship with a Child table; so for each row of the Master table in Dictionary grid, you or your customer can view and edit the related rows of the Child table in a dictionary grid.

You can turn off all or some of these features and use the combobox DataGridColumnStyle just as an easy dropdown DataGrid combobox.

You can set its DataSource, DisplayMember, and ValueMember to bind the combobox to a foreign table.


Syntax
DataGridComboBoxColumn(DataSource, DisplayMember, ValueMember, SearchInList, CaseSensitiveSearch, CallDictionary, DisplayMode, allDictionaryColumns)

Parameters

DataSource - a source for DataGrid values list as System.Data.DataTable

DisplayMember - field to display in combo as Integer (index of column) or as String (name of table column)

ValueMember - field with values, which binds to combo as Integer (index of column) or as String (name of table column). Specify the contents of the ValueMember property in cases where you bind data.

SearchInList - identifies if you need auto-fill features as Boolean (default is True)

CaseSensitiveSearch - as Boolean (default is False)

CallDictionary - as Boolean (default is True). If False - the combobox is just a dropdown combobox without the dictionary grid.

DisplayMode - Identifies what kind of data you would like to see in whole DataGrid customized column, as DataGridComboBoxColumn.DisplayModes. You may choose the following values:
ShowDisplayMember - default. DisplayMember will be shown in whole column
ShowValueMember - ValueMember will be shown in whole column
ShowValueMember_and_DisplayMember - ValueMember + DisplayMember will be shown together in a column

allDictionaryColumns - works if CallDictionary is True only. The parameter identifies how many columns you need to see in the called Dictionary grid (default is 0)
You may set the following values:
0 - default. DisplayMember and/or ValueMember fields will be shown in your Dictionary grid.
1 - all related child table's fields will be shown in your Dictionary grid.
2 - all related child table's fields will be shown in your Dictionary grid except relation key fields.

Also you can leave the allDictionaryColumns parameter (define it as null in C# and C++ code) and specify your own columns for the Dictionary datagrid. Please see our samples to learn how to do that.

' Set datagrid column styles
With TableStyle.GridColumnStyles
' Set datagrid ColumnStyle for Car field
.Add(New DataGridTextBoxColumn(tblCrrncMngr.GetItemProperties.Item("Car")))
With .Item(0)
.MappingName = "Car"
.HeaderText = "Car Name"
.Width = 130
.NullText = String.Empty
.ReadOnly = True
End With

' Set datagrid ComboBox ColumnStyle for PubID field
.Add(New DataGridComboBoxColumn(ds.Tables.Item("Companies"), 1, 0))
' Datagrid ComboBox DisplayMember field has order number 1. Name of this column is "Name"
' Datagrid ComboBox ValueMember field has order number 0. Name of this column is "PubID"
With .Item(1)
.MappingName = "PubID"
.HeaderText = "Company ID"
.Width = 200
.NullText = String.Empty
End With

' Set datagrid combobox ColumnStyle for State field
.Add(New DataGridComboBoxColumn(ds.Tables.Item("States"), 0, 0, , , False))
' Datagrid ComboBox DisplayMember field has order number 0. Name of this column is "State"
' Datagrid ComboBox ValueMember field has order number 0. It is the same column like for DisplayMember
With .Item(2)
.MappingName = "State"
.HeaderText = "State"
.Width = 45
.NullText = String.Empty
End With

' Set datagrid XP Style Button ColumnStyle for City field
.Add(New DataGridXPButtonColumn())
' Also you may set datagrid Button ColumnStyle for City
' field without XP Button Style as the following:
' .Add(New DataGridButtonColumn())
With .Item(3)
.MappingName = "City"
.HeaderText = "City"
.Width = 60
.NullText = String.Empty
End With

' Set datagrid Memo ColumnStyle for Comments field
.Add(New DataGridMemoColumn("Car description"))
With .Item(4)
.MappingName = "Comments"
.HeaderText = "Comments"
.Width = 60
.NullText = String.Empty
End With
End With

// Set column styles
// Set datagrid ColumnStyle for Car field
DataGridTextBoxColumn colCar = new DataGridTextBoxColumn();
colCar.MappingName = "Car";
colCar.HeaderText = "Car Name";
colCar.Width = 130;
colCar.NullText = String.Empty;
colCar.ReadOnly = true;
TblStyle.GridColumnStyles.Add(colCar);

// Set datagrid ComboBox ColumnStyle for PubID field
DataTable tblCompanies = ds.Tables["Companies"];
TblStyle.GridColumnStyles.Add(new DataGridComboBoxColumn(ref tblCompanies, 1, 0, true, false, true));
// Datagrid ComboBox DisplayMember field has order number 1. Name of this column is "Name"
// Datagrid ComboBox ValueMember field has order number 0. Name of this column is "PubID"
TblStyle.GridColumnStyles[1].MappingName = "PubID";
TblStyle.GridColumnStyles[1].HeaderText = "Company ID";
TblStyle.GridColumnStyles[1].Width = 200;
TblStyle.GridColumnStyles[1].NullText = String.Empty;

// Set datagrid combobox ColumnStyle for State field
DataTable tblStates = ds.Tables["States"];
TblStyle.GridColumnStyles.Add(new DataGridComboBoxColumn(ref tblStates, 0, 0, true, false, false));
// Datagrid ComboBox DisplayMember field has order number 0. Name of this column is "State"
// Datagrid ComboBox ValueMember field has order number 0. It is the same column like for DisplayMember
TblStyle.GridColumnStyles[2].MappingName = "State";
TblStyle.GridColumnStyles[2].HeaderText = "State";
TblStyle.GridColumnStyles[2].Width = 45;
TblStyle.GridColumnStyles[2].NullText = String.Empty;

// Set datagrid XP Style Button ColumnStyle for City field
TblStyle.GridColumnStyles.Add(new DataGridXPButtonColumn());
// Also you may set datagrid Button ColumnStyle for City
// field without XP Button Style as the following:
// .Add(New DataGridButtonColumn())
TblStyle.GridColumnStyles[3].MappingName = "City";
TblStyle.GridColumnStyles[3].HeaderText = "City";
TblStyle.GridColumnStyles[3].Width = 60;
TblStyle.GridColumnStyles[3].NullText = String.Empty;

// Set datagrid Memo ColumnStyle for Comments field
TblStyle.GridColumnStyles.Add(new DataGridMemoColumn("Car description"));
TblStyle.GridColumnStyles[4].MappingName = "Comments";
TblStyle.GridColumnStyles[4].HeaderText = "Comments";
TblStyle.GridColumnStyles[4].Width = 60;

There are several frequently asked questions regarding datagrid combobox column implementation listed below.

The DataGridComboBoxColumn's combo object has the same properties as the .NET ComboBox control.
The following example sets the BackColor property so that will display red background.
This code assumes that an instance of a DataGridComboBoxColumn grid column style has been created on your custom DataGrid.

Private Sub DataGrid1_Enter(ByVal sender As Object, ByVal e As System.EventArgs) Handles DataGrid1.Enter
' Identify TempColumn object that is the DataGridComboBoxColumn's "child"
Dim TempColumn As DataGridComboBoxColumn = DataGrid1.TableStyles(0).GridColumnStyles(1)
' Change combobox background color to red
TempColumn.combo.BackColor = Color.Red
' Change combobox characters' color to yellow
TempColumn.combo.ForeColor = Color.Yellow
End Sub

// Identify TempColumn object that is the DataGridComboBoxColumn's "child"
DataGridComboBoxColumn TempColumn =
(DataGridComboBoxColumn) DataGrid1.TableStyles[0].GridColumnStyles[3];
// Change combobox background color to red
TempColumn.combo.BackColor = Color.Red;
/ Change combobox characters' color to yellow
TempColumn.combo.ForeColor = Color.Yellow;

The DataGridComboBoxColumn column style control gives an ability to get a nesting combo box that filters values from a related child table. In a dictionary grid, you can view and edit related data in a child table.
In our sample database we have "Corps" Master table that has a one-to-many relationship with a "Cars" Child table; so for each row of the "Corps" table in Dictionary grid, we can view and edit the related rows of the "Cars" child table in a dictionary grid. These two tables are related each other by fields key: "ID + Corp".
For this case we have to define two string arrays with key fields' names MasterFields and ChildFields. To get the filtering we must identify Master and Child tables' key fields. These fields names in both arrays must have the same order sequence.

' Identify "Corps" Master and "Cars" Child tables' key fields
Dim dc As DataGridComboBoxColumn = DataGrid1.TableStyles(0).GridColumnStyles(2)
' Fill MasterFields array by Master "Corps" table key fields' names
dc.combo.MasterFields(0) = "ID"
dc.combo.MasterFields(1) = "Corp"

' Fill ChildFields array by Child "Cars" table key fields' names
dc.combo.ChildFields(0) = "ID"
dc.combo.ChildFields(1) = "Corp"

// Identify "Corps" Master and "Cars" Child tables' key fields
DataGridComboBoxColumn dc =
(DataGridComboBoxColumn) DataGrid1.TableStyles[0].GridColumnStyles[2];
// Fill MasterFields array by Master "Corps" table key fields' names
dc.combo.MasterFields[0] = "ID";
dc.combo.MasterFields[1] = "Corp";

// Fill ChildFields array by Child "Cars" table key fields' names
dc.combo.ChildFields[0] = "ID";
dc.combo.ChildFields[1] = "Corp";

DataGridComboBoxColumn ActivateDictionary event runs when the datagrid ComboBoxColumn Style's
nesting Dictionary datagrid is activated (the additional dropdown button is clicked).
We use the procedure to specify what dictionary columns will be shown.

' Define "Models" Dictionary Grid Column
ModelColumn = DataGrid1.TableStyles(0).GridColumnStyles(3)

.............

Private Sub ModelColumn_ActivateDictionary(ByVal sender As DataGridComboBoxColumn) Handles ModelColumn.ActivateDictionary
Dim TableStyle As New DataGridTableStyle()
Dim DictionrGridColumns As GridColumnStylesCollection = TableStyle.GridColumnStyles

' Define columns
With DictionrGridColumns
.Add(New DataGridTextBoxColumn())
With .Item(0)
.MappingName = "ModelID"
.HeaderText = "Model ID"
.Width = 40
.NullText = String.Empty
End With
.Add(New DataGridTextBoxColumn())
With .Item(1)
.MappingName = "Model"
.HeaderText = "Model"
.Width = 60
.NullText = String.Empty
End With
.Add(New DataGridComboBoxColumn(ds.Tables.Item("BodyStyle"), 0, 0))
With .Item(2)
.MappingName = "Body Style"
.HeaderText = "Body Style"
.Width = 120
.NullText = String.Empty
End With
.Add(New DataGridNumericColumn(True, True, Year(Now), 1955, 2020, 4))
With .Item(3)
.MappingName = "Year"
.HeaderText = "Year"
.Width = 50
.NullText = String.Empty
End With
End With
' Define Dictionary Grid Columns Styles
ModelColumn.combo.DictionaryGridColumns = DictionrGridColumns
' Define Dictionary Grid Height
ModelColumn.combo.DictionaryGridHeight = 250
' Define Dictionary Grid Width
ModelColumn.combo.DictionaryGridWidth = 350
End Sub

// Define "Models" Dictionary Grid Column
ModelColumn = (DataGridComboBoxColumn) DataGrid1.TableStyles[0].GridColumnStyles[3];
// ModelColumn object handles the
// Rustemsoft.DataGridColumns.DataGridComboBoxColumn.ActivateDictionary event
ModelColumn.ActivateDictionary +=
new Rustemsoft.DataGridColumns.DataGridComboBoxColumn.ActivateDictionaryEventHandler(this.ModelColumn_ActivateDictionary);

.............

private void ModelColumn_ActivateDictionary(DataGridComboBoxColumn sender)
{
DataGridTableStyle TableStyle = new DataGridTableStyle();
GridColumnStylesCollection DictionrGridColumns = TableStyle.GridColumnStyles;

// Define columns
DictionrGridColumns.Add(new DataGridTextBoxColumn());
DictionrGridColumns[0].MappingName = "ModelID";
DictionrGridColumns[0].HeaderText = "Model ID";
DictionrGridColumns[0].Width = 40;
DictionrGridColumns[0].NullText = String.Empty;

DictionrGridColumns.Add(new DataGridTextBoxColumn());
DictionrGridColumns[1].MappingName = "Model";
DictionrGridColumns[1].HeaderText = "Model";
DictionrGridColumns[1].Width = 60;
DictionrGridColumns[1].NullText = String.Empty;

DataTable tblBodyStyle = ds.Tables["BodyStyle"];
// One more DataGridComboBoxColumn object is enclosed into the datagrid
DictionrGridColumns.Add(new DataGridComboBoxColumn(ref tblBodyStyle, 0, 0, true, false, true, Rustemsoft.DataGridColumns.DataGridComboBoxColumn.DisplayModes.ShowDisplayMember,0));
DictionrGridColumns[2].MappingName = "Body Style";
DictionrGridColumns[2].HeaderText = "Body Style";
DictionrGridColumns[2].Width = 120;
DictionrGridColumns[2].NullText = String.Empty;

DictionrGridColumns.Add(new DataGridNumericColumn(true, true, DateTime.Now.Year, 1955, 2020, 4, null));
DictionrGridColumns[3].MappingName = "Year";
DictionrGridColumns[3].HeaderText = "Year";
DictionrGridColumns[3].Width = 50;
DictionrGridColumns[3].NullText = String.Empty;

// Define Dictionary Grid Columns Styles
ModelColumn.combo.DictionaryGridColumns = DictionrGridColumns;
// Define Dictionary Grid Height
ModelColumn.combo.DictionaryGridHeight = 250;
// Define Dictionary Grid Width
ModelColumn.combo.DictionaryGridWidth = 350;
}