Articles in this section
Category / Section

How to create DropDown DataGrid column in WinForms DataGrid (SfDataGrid)?

2 mins read

WinForms DataGrid (SfDataGrid) allows you to show another SfDataGrid in a dropdown of a column by creating a custom column using ComboDropDown control as edit element

public Form1()
{
    InitializeComponent();
 
    sfDataGrid.CellRenderers.Add("DropDownDataGrid", new GridDropDownDataGridCellRenderer(this.sfDataGrid));
 
    sfDataGrid.Columns.Add(new GridDropDownDataGridColumn() { MappingName = "ShipCityID", HeaderText = "Ship City", DataSource = new CountryInfoRepository().Cities });
}
 
public class GridDropDownDataGridColumn : GridColumn
{
 
    public GridDropDownDataGridColumn()
    {
        SetCellType("DropDownDataGrid");
    }
 
    public IEnumerable DataSource { get; set; }
}
 
public class GridDropDownDataGridCellRenderer : GridVirtualizingCellRendererBase<ComboDropDown>
{
    SfDataGrid DataGrid { get; set; }
    public GridDropDownDataGridCellRenderer(SfDataGrid dataGrid)
    {
        DataGrid = dataGrid;
    }
    protected override void OnRender(Graphics paint, Rectangle cellRect, string cellValue, CellStyleInfo style, DataColumnBase column, RowColumnIndex rowColumnIndex)
    {
        base.OnRender(paint, cellRect, cellValue, style, column, rowColumnIndex);
    }
 
    
 
    protected override void OnInitializeEditElement(DataColumnBase column, RowColumnIndex rowColumnIndex, ComboDropDown uiElement)
    {
        Rectangle editorRectangle = GetEditorUIElementBounds();
        uiElement.Size = editorRectangle.Size;
        uiElement.Location = editorRectangle.Location;
        uiElement.DropDownWidth = 300;
 
        SfDataGrid dropDownDataGrid = new SfDataGrid()
        {
            DataSource = (column.GridColumn as GridDropDownDataGridColumn).DataSource,
        };
 
        uiElement.PopupControl = dropDownDataGrid;
        uiElement.DropDownStyle = ComboBoxStyle.DropDownList;
 
        this.TableControl.Controls.Add(uiElement);
        uiElement.Focus();
 
        base.OnInitializeEditElement(column, rowColumnIndex, uiElement);
 
        dropDownDataGrid.SelectionChanged += DropDownDataGrid_SelectionChanged;
 
 
    }
 
    private void DropDownDataGrid_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        this.DataGrid.View.GetPropertyAccessProvider().SetValue(this.DataGrid.SelectedItem, this.DataGrid.CurrentCell.Column.MappingName, (e.AddedItems[0] as ShipCityDetails).ShipCityID);
        (this.DataGrid.CurrentCell.CellRenderer.CurrentCellRendererElement as ComboDropDown).Text = (e.AddedItems[0] as ShipCityDetails).ShipCityID.ToString();
        (this.DataGrid.CurrentCell.CellRenderer.CurrentCellRendererElement as ComboDropDown).DroppedDown = false;
    }
}
 

 

DropDownGrid

 

Take a moment to peruse the documentation, where you can find about custom column support in SfDataGrid, with code examples.

You can download the example from GitHub

 

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments
Please  to leave a comment
Access denied
Access denied