Bind nested object to data grid

١٥٥ и 21 Reputation points
2022-03-07T11:32:31.93+00:00

I have a DataGrid that has two columns (A and B). Each column cell contains a combo box control.

I have an object that contains two list items that I want to bind to the grid view, but the binding does not work.

Binding in both DataTemplates not working correctly. UI shows the namespace instead of value.

Sample Project: https://1drv.ms/u/s!Ah27QQNpKj4jj2xsIsQamaOXOlin?e=jNAj2H

View Model:

public class MainWindowViewModel {
  public List < MainObject > MainObjects { get; set; }

  public MainWindowViewModel() {
    MainObjects = new List < MainObject > {
      new MainObject {
        AColumns = new List < ColumnA > {
          new ColumnA { Name = "A1" },
          new ColumnA { Name = "A1" }
        },
        BColumns = new List < ColumnB > {
          new ColumnB { Name = "B1" },
          new ColumnB { Name = "B1" }
        },
      }
    };
  }
}

public class MainObject {
  public List < ColumnA > ?AColumns { get; set; }
  public List < ColumnB > ?BColumns { get; set; }
}

public class ColumnA {
  public string ? Name { get; set; }
}

View:

<Window x:Class="TestDataGrid.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <DataGrid ItemsSource="{Binding MainObjects}" AutoGenerateColumns="False">
        <DataGrid.Columns>
            <DataGridTemplateColumn Header="Column A" Width="Auto">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock HorizontalAlignment="Center">
                            <TextBlock.Text>
                                <PriorityBinding>
                                    <Binding Path="Name" Mode="TwoWay" />
                                </PriorityBinding>
                            </TextBlock.Text>
                        </TextBlock>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
                <DataGridTemplateColumn.CellEditingTemplate>
                    <DataTemplate>
                        <ComboBox IsEditable="True" Text="{Binding Name, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" ItemsSource="{Binding AColumns}"/>
                    </DataTemplate>
                </DataGridTemplateColumn.CellEditingTemplate>
            </DataGridTemplateColumn>
        </DataGrid.Columns>
    </DataGrid>
</Window>
Windows Presentation Foundation
Windows Presentation Foundation
A part of the .NET Framework that provides a unified programming model for building line-of-business desktop applications on Windows.
2,685 questions
XAML
XAML
A language based on Extensible Markup Language (XML) that enables developers to specify a hierarchy of objects with a set of properties and logic.
768 questions
{count} votes

Accepted answer
  1. Hui Liu-MSFT 40,866 Reputation points Microsoft Vendor
    2022-03-08T02:12:18.963+00:00

    You could modify the binding of the Combobox as follows:

     <DataTemplate>  
                            <ComboBox IsEditable="True" DisplayMemberPath="Name"  ItemsSource="{Binding AColumns}"/>  
                        </DataTemplate>  
    

    The result:
    180776-image.png


    If the response is helpful, please click "Accept Answer" and upvote it.
     Note: Please follow the steps in our [documentation][5] to enable e-mail notifications if you want to receive the related email notification for this thread. 

    [5]: https://learn.microsoft.com/en-us/answers/articles/67444/email-notifications.html

    0 comments No comments

0 additional answers

Sort by: Most helpful