How to resolve null data on Observable Collection

I've set up a database on MongoLab that is queried and parsed to a Model. The collection in that model is in turn bound to the data grid. But when I query the database, the only data showing on the grid is the object ID for the document.

In order to debug the issue I initialized the list with constant data for each field, and the binding works, filling each field on the grid.

Which then lead me to check how I'm mapping the data to the Model.

I then stepped through the contents of the Observable collection that is returned from the server query.

That showed that all the data is being returned, but all model fields are null. Instead an array of customers is created and fields populated within separate customer objects.

Does anyone know how I can debug this further?

First I checked the contents of the collection, returned from the query. Which shows the null Model fields and the array of customers:

Then I checked the contents of the customers Customer array (which are populated):

The document JSON is defined in MongoLab, then mapped to the CustomerCollection in the app CustomerModel:

http://hastebin.com/ipatatoqif.pl

CustomerModel:

public class CustomerModel : INotifyPropertyChanged
{

    private ObjectId id;
    private string firstName;
    private string lastName;
    private string email;

    [BsonElement]
    ObservableCollection<CustomerModel> customers { get; set; }


    /// <summary>
    /// This attribute is used to map the Id property to the ObjectId in the collection
    /// </summary>
    [BsonId]
    public ObjectId Id 
    {
        get
        {
            return id;
        }
        set
        {

            id = value;
        }
    }

    [BsonElement("firstName")]
    public string FirstName
    {
        get
        {
            return firstName;
        }
        set
        {
            firstName = value;
            RaisePropertyChanged("FirstName");
        }
    }

    [BsonElement("lastName")]
    public string LastName
    {
        get
        {
            return lastName;
        }
        set
        {
            lastName = value;
            RaisePropertyChanged("LastName");
        }
    }

    [BsonElement("email")]
    public string Email
    {
        get
        {
            return email;
        }
        set
        {
            email = value;
            RaisePropertyChanged("Email");
        }
    }


    public event PropertyChangedEventHandler PropertyChanged;
    private void RaisePropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

This is the data that shows on the grid, only the ObjectID at present:

I wouldn't store an ObservableCollection<T> directly in MongoDB.

Instead, I would store a List<T> in MongoDB.

Why? An ObservableCollection<T> is a WPF-specific data structure, and probably won't work with MongoDB unless you write a custom serializer.

If you are using MVVM, you need to separate the data stored in MongoDB from the ViewModel. I would recommend retrieving the data from MongoDB, then mapping this into your ViewModel using a mapper such as AutoMapper or ExpressMapper.

See another person who ran into the same problem.