Programmatically adding GridComboBoxColumn to the grid

[df]

Hi, 

I'm adding data to sfDataGrid in C# code dynamically depending of the datasource. ItemsSouce is DataTable from DataSet and data is displayed.

When I want to add GridComboBoxColumn() then data is not shown

Code;

XAML

 <Syncfusion:SfDataGrid  x:Name="sfDataGrid2"    HorizontalAlignment="Left" Height="159" Margin="53,440,0,0" VerticalAlignment="Top" Width="922" AllowFiltering="True"  RowHeaderWidth="15" AddNewRowPosition="FixedTop" FooterRowsCount="1" RowHeight="18" AutoGenerateColumns="False" AutoGenerateColumnsMode="ResetAll"/>

C#

        public void FillDataSet()

        {

        

            DataTable dtArticles = new DataTable("Articles");

            dtArticles.Columns.Add("id");

            dtArticles.Columns.Add("name");

            dtArticles.Columns.Add("idgroup");

            dtArticles.Rows.Add(1, "Cola",1);

            dtArticles.Rows.Add(2, "Pizza",2);

            dtArticles.Rows.Add(3, "Steak", 2);

            DataTable dtGroups= new DataTable("Groups");

            dtGroups.Columns.Add("idgroup");

            dtGroups.Columns.Add("groupname");

            dtGroups.Rows.Add(1,"Drink");

            dtGroups.Rows.Add(2,"Food");

            ds = new DataSet("gastronomy");

            ds.Tables.Add(dtArticles);

            ds.Tables.Add(dtGroups);

        }

  private void FillDataGrid()

        {

            FillDataSet();

            sfDataGrid2.Columns.Clear();

            sfDataGrid2.ItemsSource = ds.Tables["Articles"].DefaultView;

            sfDataGrid2.AutoGenerateColumns = false;

            sfDataGrid2.AutoGenerateColumnsMode = AutoGenerateColumnsMode.ResetAll;

            //Column definition

            sfDataGrid2.Columns.Add(new GridNumericColumn() { HeaderText = "Article ID", MappingName = "id", NumberDecimalDigits = 0, ColumnSizer = GridLengthUnitType.SizeToHeader });

            sfDataGrid2.Columns.Add(new GridTextColumn() { HeaderText = "Name", MappingName = "name" });

            //This column is only to show that data exists in this column

            sfDataGrid2.Columns.Add(new GridNumericColumn() { HeaderText = "Group ID", MappingName = "idgroup", NumberDecimalDigits = 0, ColumnSizer = GridLengthUnitType.SizeToHeader });

            sfDataGrid2.Columns.Add(new GridComboBoxColumn()

            {

                ItemsSource = ds.Tables["Groups"].DefaultView,

                HeaderText = "Group",

                MappingName = "idgroup",

                DisplayMemberPath = "groupname",

            });

        }

What I get is:

Nothing is displayed in Group column. Ofc in this column I want the user to choose from  Food, Drink options and bind that to idgroup 

I'm missing something but can't figured out. Any help is appreciated.

[Srinivasan Vasu]

Hi Dubravko, 

 

Thanks for contacting Syncfusion support. 

 

We have checked your query and we have prepared a sample as per your requirement. By default, GridComboBoxColumn displays the value using MappingName property. You can set DisplayMemberPath which denotes the path to a value on the source object(GridComboBoxColumn.ItemsSource) to serve as visual representation of object. You can set SelectedValuePath which denotes the path to get the SelectedValue from the SelectedItem. We have provided support for bound DataTable Collection as ItemSource in GridComboBoxColumn in Syncfusion version 15.2.0.40. 

 

 

Please refer the below code. 

 

   <Syncfusion:SfDataGrid  x:Name="sfDataGrid2"    

                                HorizontalAlignment="Left" 

                                Height="159" 

                                VerticalAlignment="Top" 

                                Width="922"  

                                AllowFiltering="True"  

                                RowHeaderWidth="15"                   

                                AllowEditing="True" 

                                FooterRowsCount="1"  

                                RowHeight="18"  

                                AutoGenerateColumns="False"  

                                AutoGenerateColumnsMode="ResetAll"> 

        </Syncfusion:SfDataGrid> 

     //Column definition 

            sfDataGrid2.Columns.Add(new GridNumericColumn() 

            { 

                HeaderText = "Article ID", 

                MappingName = "id", 

                NumberDecimalDigits = 0, 

                ColumnSizer = GridLengthUnitType.SizeToHeader 

            }); 

            sfDataGrid2.Columns.Add(new GridTextColumn() { HeaderText = "Name", MappingName = "name" }); 

            //This column is only to show that data exists in this column 

            sfDataGrid2.Columns.Add(new GridNumericColumn() { HeaderText = "Group ID", MappingName = "idgroup", NumberDecimalDigits = 0, ColumnSizer = GridLengthUnitType.SizeToHeader }); 

 

 

            sfDataGrid2.Columns.Add(new GridComboBoxColumn() 

            { 

                MappingName = "idgroup", 

                ItemsSource = view.ComboBoxDetails.DefaultView, 

                HeaderText = "Group",                 

                DisplayMemberPath = "groupname", 

                SelectedValuePath = "idgroup" 

            }); 

            sfDataGrid2.ItemsSource = view.Details.DefaultView; 

 

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/general/ze/WpfApplication11013668485.zip 

 

 

Regards, 

Srinivasan 

[df]

Thank you for the reply. I still have the same problem. 

When I run your project I get this

When I click on the Group field I can see Drink and Food in Combobox 

but after selection, nothing is displayed in previous field

This is the same problem I had before. Could you please advise how to proceed.

Best regards,

[Srinivasan Vasu]

Hi Dubravko, 

 

We have tested the provided sample and the sample working fine in our side. We have attached the tested video for your reference. In our previous update, we have mentioned the support provided for bound DataTable Collection as ItemsSource  in GridComboBoxColumn in Syncfusion version 15.2.0.40. So, could you please confirm your syncfusion product version? It will be helpful to analyze further. 

Video : http://www.syncfusion.com/downloads/support/directtrac/general/ze/Video-1269423827.zip 

 

Regards, 

Srinivasan 

[df]

Hi,

my bad. I still have 14.2460.0.26 version installed. I installed 15.0.2.40 right away to check it. The newest version I installed on my laptop but I didn't tried there.

I will try and get back to you.

Thanks for your effort and time.

[df]

Hi,

my bad. I still have 14.2460.0.26 version installed. I installed 15.0.2.40 right away to check it. The newest version I installed on my laptop but I didn't tried there.

I will try and get back to you.

Thanks for your effort and time.

Hi

just to confirm it works with new version.

Thank you again.

[Srinivasan Vasu]

Hi Dubravko, 

  

Thanks for your update. 

  

Please let us know if you need further assistance on this. 

  

Regards, 

Srinivasan 

[henry Kim]

When customizing your grid by programmatically adding a GridComboBoxColumn, it’s helpful to consider how users interact with individual selections or items. Similarly, Wendy's Menu Price provides updated details for each menu item, giving a clear snapshot for easy selection. Just like in grids, having precise item information makes decision-making smoother and more efficient.

[Adnan Ali]

You’re very close — the issue is mainly about binding the ComboBox value correctly.

GridComboBoxColumn needs both a display field and a value field so it knows how to map the selected item back to the underlying idgroup in your Articles table.

Right now, you’ve set DisplayMemberPath, but you’re missing SelectedValuePath.

What to fix

Add SelectedValuePath = "idgroup" to the GridComboBoxColumn.

Corrected column code

sfDataGrid2.Columns.Add(new GridComboBoxColumn()
{
    HeaderText = "Group",
    MappingName = "idgroup",          // Binds to Articles.idgroup
    ItemsSource = ds.Tables["Groups"].DefaultView,
    DisplayMemberPath = "groupname",  // What user sees
    SelectedValuePath = "idgroup"     // What gets stored
});

Why this works

• MappingName → value in Articles (idgroup)

• ItemsSource → lookup table (Groups)

• DisplayMemberPath → shown text (groupname)

• SelectedValuePath → actual value written back (idgroup)

Without SelectedValuePath, the grid doesn’t know how to match idgroup to an item in the combo box, so it renders empty.

After this change, the column should correctly show Drink / and update idgroup as expected.

[Sweatha Bharathi]

Adnan Ali,

Thank you for the explanation and examples. Please feel free to reach out if you need any further assistance; we will be happy to help.

[David Tom]

You’re missing SelectedValuePath. The combo box can’t match idgroup to the lookup table without it.

Add this:

SelectedValuePath = "idgroup"

That will correctly display Food/Drink while binding to idgroup.