What is Model and ViewModel in MVC Pattern?

Abhimanyu K Vatsa

MVC PatternModel in MVC PatternViewModel in MVC Pattern

16 Comments

Join the conversation! Your thoughts help the community grow.

SASMIT VINCHURKAR4y ago
Model : It's the exact copy of the DB TABLE, Model consist of properties i.e. getters and setters. VIEW MODEL is customized properties with respect to DB Table with few extra properties. Ex Say we have a Drop-down list of BookingStatus and say a Separate Table which Exist in DB having Column as BookingId and BookingStatus. In VIEW MODEL we can declare a property of BookingId and List<SelectListItem> BookingStatus. From Controller we can fetch the data and render this VIEWMODEL into VIEW i.e. cshtml and display the drop-down list.
Daniel Patfield5y ago
I understand your example and description, but that seems like a lot of trouble just to avoid inserting a rePassword into a DB. And I don't understand the benefit of the Blog ViewModel. Can you give any other examples of a ViewModel that would save a lot of redundancy? Or whatever else a ViewModel benefits?
Brandon Moore6y ago
Your points in regard to the difference between a "Domain Model" and "ViewModel" are good. However your definition of a Model in the context of MVC is not good, and very confusing for people who don't already know. The nature of asp.net MVC makes this an easy mistake to make unfortunately. The Model portion of MVC refers to the layer that "directly manages the data, logic and rules of the application" (as per Wikipedia). Most people mistake the ViewModel as being the Model in Asp.Net MVC, but really it is only a part of it as the Model encompasses much more than that.
Brijesh Mavani7y ago
Yeah, sure it's help.
morani farhad8y ago
Thanks ..Helpful explained
Narasimha Murthy8y ago
Easy to understand.Thanks
viswanath p8y ago
Tq very much sir
Satish B8y ago
One of the finest example sir, thank Q.
Dennis Thomas8y ago
A helpful article explained in simple words!
Amit Kumar Singh8y ago
Nice one .. Thanks for sharing
gowshik raj9y ago
By doing this, are we not breaking the MVC pattern ? Is this a best practice ?
Karthik Elumalai9y ago
Clearly explained and easy to understand.Thanks
Sheeraz alam9y ago
Clear understanding. Very helpful
Johannes Gansowen10y ago
alright.. got it! thanks
Ric Douglass10y ago
Thank you! This was very clear and succinct.
Saineshwar Bageri12y ago
nice one sir

Model and ViewModel are two things we always hear about in MVC. In this article I will show you the differences between them.

Let's begin with its common definition.

What is Model or Domain Model?

Actually, the word "model" has hundreds of meanings in software development, but here we will talk about "model" in the context of a MVC design pattern. I would define a model as an object that we use to send information to the database, to perform business calculations and to render a view. In other words, "model" represents the domain of the application that helps us to save, create, update and delete records. Usually we put all our model classes in the Model folder.

What is ViewModel?

ViewModel in the MVC design pattern is very similar to a "model". The major difference between "Model" and "ViewModel" is that we use a ViewModel only in rendering views. We put all our ViewModel classes in a "ViewModels" named folder, we create this folder.

Understand it with an example

Let's assume we want to implement a view page that will have three textboxes for Username, Password and Re-enter Password. To do this we could design a "Model" as given below:

public class Login
{
public String Username { get; set; }
public String Password { get; set; }
public String RePassword { get; set; }
}

For the sake of the view this model works fine. But this is actually an incorrect approach because we are trying to overcrowd the database. I can't see any use of the "RePassword" property in the database.

Now, if we take the advantage of a ViewModel, we can safeguard the database from redundant data. Here's how, design the following "Model" that will be our Domain Model:

//this will represent domain of the application
public class Login
{
public String Username { get; set; }
public String Password { get; set; }
}

And then following "ViewModel"

//this will help in rendering great views
public class LoginViewModel
{
public String Username { get; set; }
public String Password { get; set; }
public String RePassword { get; set; }
}

Now, when adding the view, pick the ViewModel class to get the strongly-typed benefits.

Now the question is, how do we transform the Model or Domain Model from the "ViewModel"? Let's see how.

Transforming Model from ViewModel

There are various ways to do this. In the form POST action we can create a new object of type Login model and then assign the properties one by one and leave the unwanted properties.

[HttpPost]
public ActionResult Login(LoginViewModel viewModel)
{
//validate the ViewModel
//transforming Model (Domain Model) which is Login from ViewModel which is LoginViewModel
var login = new Login()
{
Username = viewModel.Username,
Password = viewModel.Password
};
//save the login var
return View();
}

In the code above, after validating the ViewModel I'm transforming the Model or Domain Model. So, by using this way you can stop overcrowding the database with unnecessary fields.

Let's look at one more use of ViewModel

I've a blog where I want to display the list of the latest posts, latest comments, post categories in a single view. How I can do that? I can strongly type my view to any one of the models, right? Here comes the view model.

I created a view model called BlogViewModel that contains the latest posts, latest comments and other stuff as properties and I bind my view with this model. The posts and comments are domain models while the BlogViewModel is the view model I created specially for the view.

Tomorrow I'll show my blog in a mobile version and at that time I may create a simple view model that contains only fewer properties. Finally, view models are for views and usually they acts as wrappers over the real domain models.

Hope this helps.