ViewModel in ASP.NET Core MVC

In any MVC application, managing data between the controller and the view becomes increasingly complex as the application grows. While models help define the structure of data, they are not always sufficient for handling real-world UI requirements.

This is where ViewModels come into the picture.

To understand their importance, consider a situation where a page needs to display data from multiple sources or requires only a subset of data from a model. Using the main model directly in such cases can lead to unnecessary data exposure and tightly coupled code.

ViewModels solve this problem by acting as a layer specifically designed for the view.

What is a ViewModel?

A ViewModel is a class that is designed specifically to pass data from the controller to the view. Unlike models, which represent the structure of data in the application or database, ViewModels are tailored to meet the needs of a particular view.

A ViewModel can be thought of as a wrapper around one or more models, designed specifically for the needs of a view.

It does not always represent the complete model. Instead, it selects, combines, or reshapes data so that the view receives only what it requires. They allow you to shape data exactly the way the UI requires it.

In simple terms:

  • Model → Represents data structure
  • ViewModel → Represents data required by the view

Why Not Use Models Directly?

At first, it may seem convenient to pass models directly to the view. However, this approach creates several issues.

  • Models may contain extra fields not required by the UI
  • Sensitive data might be exposed unintentionally
  • UI-specific formatting becomes difficult
  • Combining multiple data sources is not clean

For example, a Product model may contain internal fields like cost price or supplier details, which should not be displayed to the user.

Using ViewModels allows you to control exactly what is sent to the view..

Example: Model vs ViewModel

Let’s consider a product model.

public class Product
{
    public int Id { get; set; }

    public string Name { get; set; }

    public decimal Price { get; set; }

    public decimal CostPrice { get; set; }
}

Now suppose the UI only needs Name and Price.

Instead of sending the entire model, we create a ViewModel.

public class ProductViewModel
{
    public string Name { get; set; }

    public decimal Price { get; set; }
}

This ensures only required data is passed to the view.

Using ViewModel in Controller

The controller prepares the ViewModel before sending it to the view.

public IActionResult Details()
{
    var product = new Product
    {
        Id = 1,
        Name = "Laptop",
        Price = 75000,
        CostPrice = 50000
    };

    var vm = new ProductViewModel
    {
        Name = product.Name,
        Price = product.Price
    };

    return View(vm);
}

This step is called mapping.

Displaying ViewModel in Razor View

<h2>Product Details</h2>

<p>
    <strong>Name:</strong>
    @Model.Name
</p>

<p>
    <strong>Price:</strong>
    @Model.Price
</p>

The view now works only with the ViewModel, not the full model.

Combining Multiple Models into One ViewModel

ViewModels become even more useful when data comes from multiple sources.

public class OrderViewModel
{
    public string CustomerName { get; set; }

    public string ProductName { get; set; }

    public decimal Price { get; set; }
}

This allows you to combine data from different models into a single object for the view.

Separation of Concerns

One of the main reasons to use ViewModels is to maintain a clear separation of concerns in your application.

Each part of MVC has a specific responsibility:

  • Models → represent business or database data
  • ViewModels → represent UI-specific data
  • Views → display data

If models are used directly in views, the boundaries between these layers become unclear.

For example, adding UI-specific logic inside models can make them harder to maintain and reuse.

ViewModels solve this problem by acting as a dedicated layer for the view.

This keeps your application:

  • Cleaner
  • Easier to maintain
  • More scalable

This separation becomes especially important as applications grow in size and complexity.

Using ViewModels for Form Handling

ViewModels are not only used to display data, but also to handle user input in forms.

In many cases, the data required for creating or updating a record is different from the actual model. ViewModels allow you to define exactly what input fields are needed.

For example, when creating a product, you may only need Name and Price.

public class ProductCreateViewModel
{
    public string Name { get; set; }

    public decimal Price { get; get; }
}

This ViewModel is then used in the controller:

[HttpPost]
public IActionResult Create(ProductCreateViewModel model)
{
    // Use model.Name and model.Price

    return RedirectToAction("Index");
}

This ensures that only the required data is received and processed.

When Should You Use ViewModels?

  • When the UI needs only part of the model
  • When combining data from multiple models
  • When formatting data for display
  • When avoiding exposure of sensitive fields

Real-World Scenario: Edit Screen

Consider a scenario where a user wants to edit product details.

The application needs to:

  • Load existing data
  • Display it in a form
  • Allow the user to update values
  • Send updated data back to the controller

This is a perfect use case for ViewModels.

public class ProductEditViewModel
{
    public int Id { get; set; }

    public string Name { get; set; }

    public decimal Price { get; set; }
}

Controller loads data into this ViewModel and sends it to the view.

When the user submits the form, the updated values are received back in the same ViewModel.

This approach ensures consistency and avoids exposing unnecessary fields from the main model.

It also makes the code easier to understand and maintain.

Important Understanding

ViewModels are not related to APIs or DTOs.

They are strictly used in MVC to shape data for views.

This separation helps keep your application clean and maintainable.

Summary

ViewModels provide a structured way to send data from controllers to views. They allow you to control what data is displayed, improve security, and simplify UI logic.

They are one of the most important concepts in MVC and are used in almost every real-world application.

In the next section, we will explore Model Binding, which explains how data flows from the view back into the application.