How to resolve binding path error on grid view SelectedItem property? - wpf

Question

I've set up a DataGrid which is bound to an Observable collection of CustomerModel objects. Also I set up properties for each of the fields within that model and a SelectedCustomer property of type MainViewModel in the VM.
But when I select one of the rows from the DataGrid in order to populate the textboxes below, I get a path error on the field properties, FirstName etc:
System.Windows.Data Error: 40 : BindingExpression path error: 'SelectedCustomer' property not found on 'object' ''DataGrid' (Name='customersgrid')'. BindingExpression:Path=SelectedCustomer.FirstName; DataItem='DataGrid' (Name='customersgrid'); target element is 'TextBox' (Name='fNameTbx'); target property is 'Text' (type 'String')
System.Windows.Data Error: 23 : Cannot convert 'MongoDBApp.Models.CustomerModel' from type 'CustomerModel' to type 'MongoDBApp.ViewModels.MainViewModel' for 'en-US' culture with default conversions; consider using Converter property of Binding. NotSupportedException:'System.NotSupportedException: TypeConverter cannot convert from MongoDBApp.Models.CustomerModel.
In order to debug the issue, I checked my data context of the View, which is set to the VM:
private MainViewModel ViewModel { get; set; }
private static ICustomerDataService customerDataService = new CustomerDataService(CustomerRepository.Instance);
public MainView()
{
InitializeComponent();
ViewModel = new MainViewModel(customerDataService);
this.DataContext = ViewModel;
}
I also checked that the public property names matched the binding names on the UI, which they do. I do know that the second error hints that it cannot convert between the DataGrid binding source of type CustomerModel and the SelectedItem property which is of type MainViewModel.
Anyone have an idea how I can debug this further?
An example of the UI XAML and it's binding paths:
<Grid>
<DataGrid x:Name="customersgrid" Grid.RowSpan="3" Grid.Column="1" Grid.ColumnSpan="3" AutoGenerateColumns="False"
ItemsSource="{Binding Customers}" SelectedItem="{Binding SelectedCustomer}">
<DataGrid.Columns>
<DataGridTextColumn Binding="{Binding Id}" Header="ID" />
<DataGridTextColumn Binding="{Binding FirstName}" Header="First Name" />
<DataGridTextColumn Binding="{Binding LastName}" Header="Last Name" />
<DataGridTextColumn Binding="{Binding Email}" Header="Email" />
</DataGrid.Columns>
</DataGrid>
<Label Grid.Row="4" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Top" Content="First Name:" />
<TextBox x:Name="fNameTbx" Grid.Row="4" Grid.Column="2" Grid.ColumnSpan="2" Width="120" Height="23"
HorizontalAlignment="Left" VerticalAlignment="Top" TextWrapping="Wrap"
Text="{Binding SelectedCustomer.FirstName, ElementName=customersgrid}" />
</Grid>
And a short version of the MainViewModel:
namespace MongoDBApp.ViewModels
{
class MainViewModel : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
private ICustomerDataService _customerDataService;
private void RaisePropertyChanged(string propertyName)
{
if (PropertyChanged != null)
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
public MainViewModel(ICustomerDataService customerDataService)
{
this._customerDataService = customerDataService;
QueryDataFromPersistence();
}
#region Properties
private MainViewModel selectedCustomer;
public MainViewModel SelectedCustomer
{
get { return selectedCustomer; }
set
{
selectedCustomer = value;
RaisePropertyChanged("SelectedCustomer");
}
}
private ObservableCollection<CustomerModel> customers;
public ObservableCollection<CustomerModel> Customers
{
get { return customers; }
set
{
customers = value;
RaisePropertyChanged("Customers");
}
}
private string firstName;
public string FirstName
{
get { return firstName; }
set
{
firstName = value;
RaisePropertyChanged("FirstName");
}
}
#endregion
private void QueryDataFromPersistence()
{
Customers = _customerDataService.GetAllCustomers().ToObservableCollection();
}
}
}

Answer 1

The error is here:
private MainViewModel selectedCustomer;
public MainViewModel SelectedCustomer
{
get
{
return selectedCustomer;
}
set
{
selectedCustomer = value;
RaisePropertyChanged("SelectedCustomer");
}
}
Change the type of selectedCustomer to CustomerModel instead of MainViewModel