WPF binding SelectedItemBinding of a DataGridComboBoxColumn

Question

I have a student class that defines the properties of a student as follows

 public class Student
    {
        public string Department { get; set; }

    public string Level { get; set; }

    public Gender Gender { get; set; }

    public string Nationality { get; set; }

}

I have another class that contains the list of countries in a collection declared as seen below

public class Countries
    {
 public static ObservableCollection<string> Nationalities { get; } = new ObservableCollection<string>()
        {
            "Afghanistan",
            "Albania",
            "Algeria",
            "Andorra",
            "Angola",
            "Anguilla",
            "Antigua & Barbuda",
            "Argentina",
            "Armenia",
            "Australia",
            "Austria",
            "Azerbaijan",
            "Bahamas",
            "Bahrain",
            "Bangladesh",
            "Barbados",
            "Belarus",
            "Belgium",
            "Belize",
            "Benin",
            "Bermuda",
            "Bhutan",
            "Bolivia",
            "Bosnia & Herzegovina",
            "Botswana",
            "Brazil",
}

In my view model, i have declared an observable collection that is initialize to the list of countries. This is done inside the view models' constructor as seen below

public class ViewModel : BaseViewModel
    {
     public ObservableCollection<string> Nationalities { get; private set; }
         public ViewModel()
        {

            // Set the nationality list
            Nationalities = Countries.Nationalities;

        }
}

Now i have created my DataGridComboBoxColumn like so,

 <DataGrid.Columns>
                        <DataGridComboBoxColumn Width="Auto"
                                                    SelectedItemBinding="{Binding Path=Student.Nationality}"
                                                    Header="Nationality" 
                                                    x:Name="NationalityComboBox2">
                            <DataGridComboBoxColumn.EditingElementStyle>
                                <Style TargetType="ComboBox">
                                    <Setter Property="ItemsSource" Value="{Binding Path=DataContext.Nationalities, ElementName=StudentListGrid}" />
                                </Style>
                            </DataGridComboBoxColumn.EditingElementStyle>
                        </DataGridComboBoxColumn>
                    </DataGrid.Columns>

When i run my app, the DataGridComboBoxColumn have all the countries but when i select a particular country, it doesn't get displayed.I have seen similar questions online but i haven't seen any answer that works in my case. Any suggestions?

Answer 1

Instead of using a DataGridComboBoxColumn, you could use a DataGridTemplateColumn to achieve the same. You may have to write some code to maintain the style of the textbox and comboBox.

 <DataGridTemplateColumn  Header="Nationality" >
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Nationality}"/>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
                <DataGridTemplateColumn.CellEditingTemplate>
                    <DataTemplate>
                        <ComboBox SelectedItem="{Binding Nationality}" ItemsSource="{Binding Path=DataContext.Nationalities, ElementName=StudentListGrid}"/>
                    </DataTemplate>
                </DataGridTemplateColumn.CellEditingTemplate>
            </DataGridTemplateColumn>