Question

I have read several articles, tutorials and blog posts about the MVVM pattern. However there is one thing I don’t understand. Taking the three “layers”:

• Model
• View
• View Model

As far as I have understood MVVM the model contains the “raw” data, e.g. a name and address in case of a Student class. The view model exposes properties to the view which represent data of the model.

Example for a property in the view model

public string Name {
 get { return model.Name; }
 set { model.Name = value; }
}

Example for the model

private string name;

public string Name {
 get { return name; }
 set { name = value; }
}

This might sound a bit stupid but doesn’t this create a redundancy? Why do I have to keep the name in the model and in the view model? Why should one not handle the name on the view model completely?

Answer 1

In such a simple example, this answer would be yes (it is unreasonably redundant). But, presumably, a page will contain more than just a single Model object. You may have the page state as well as multiple other Model objects which must all be tracked. This is done in the ViewModel.

For example, you may have additional information about the logged in user displayed in a status bar, as well as a service running to detect changes to a text file.

You may also have a form for editing the Student object. If you intend to validate those changes, then you wouldn’t want to directly edit the Student object until after the modifications have been verified. The ViewModel can act as a temporary storage location in such a case.

Note on the above: It is not uncommon for validation to occur in the Model, but even then you will probably want the user to be able to enter invalid values while in the process of editing a form. For example, if your Model does not allow a zero-length value in a field, you still want to enable your user to delete the value, move to another field (say, for example, to copy it) then return to the field and finish editing (paste). If you are tied directly to the Model, then your validation logic may not handle this “in-between”, “not-yet-finished” state as you’d like. For example, you might not want to accost your user with validation errors until they’ve finished and clicked ‘Save’.

You will also probably have Command objects in the ViewModel to handle button clicks and the like. These would be domain-specific objects that would be useless in a Model.

ViewModels are also useful when you need to filter or somehow temporarily “modify” Model objects to get something useful on the screen. For example, you may want to display a list of all the Users in a system along with a real-time list of the top ten performers among them (updated every 10 seconds). Or you may want to show a list of Reports and a graph showing the overall usage rate, etc. Filtering, sorting and customizing that data would take place within the ViewModel.

The Model, on the other hand, is typically as pure as possible. Ideally, you want only POCOs that (usually) model exactly what’s in your persistent storage (database, or what have you). If your persistent storage has FirstName and LastName fields, then so would your Model. Only in your ViewModel would you combine them to get a Name field (either “First Last” or “Last, First” depending on the View’s needs).

For example:

namespace Model
{
    public class Student
    {
        public string FirstName { get; set; }
        public string LastName { get; set; }
    }

    public class Class
    {
        public string Name { get; set; }
        public float Score { get; set; }
    }
}

namespace ViewModel
{
    public class EditStudentRecordViewModel
    {
        private Model.Student _student;
        private IEnumerable<Model.Class> _studentClasses;

        /* Bind your View to these fields: */
        public string FullName
        {
            return _student.LastName + ", " + _student.FirstName;
        }
        public string FirstName { get; set; }
        public string LastName { get; set; }

        public IEnumerable<Model.Class> PassingClasses
        {
            get
            {
                return _studentClasses.Where( c => c.Score >= 78 );
            }
        }

        public IEnumerable<Model.Class> FailingClasses
        {
            get
            {
                return _studentClasses.Where( c => c.Score < 78 );
            }
        }

        public void Save()
        {
            List<string> l_validationErrors = new List<string>();
            if ( string.IsNullOrEmpty( this.FirstName ) )
                l_validationErrors.Add( "First Name must not be empty." );
            if ( string.IsNullOrEmpty( this.LastName ) )
                l_validationErrors.Add( "Last Name must not be empty." );

            if ( l_validationErrors.Any() )
                return;

            _student.FirstName = this.FirstName;
            _student.LastName = this.LastName;
            Model.Utilities.SaveStudent( _student );
        }
    }
}