ASP.NET MVC Passing data from Controller to View

ASP.NET MVC is a framework that facilitates building web applications based on MVC (Model-View-Controller) design pattern. Request coming from client reaches the Controller through URL Rewriting Module. Controller decides which model to use in order to fulfill the request. Further passing the Model data to View which then transforms the Model data and renders response to client as shown in following basic level request flow diagram.

You can access to Complete ASP.NET MVC Tutorial Series on building Online MVC Shopping Cart Application with source code here.

Complete ASP.NET MVC 5 Online Course

Build a Real-world App with ASP.NET Core and Angular 2+

In this ASP.NET MVC Tutorial, we will discuss and implement different options to pass data from ASP.NET MVC Controller to View.

Let's begin by answering a simple ASP.NET MVC Question

You are working as ASP.NET MVC developer at WebDevTutorials and developing a library that supports multiple ASP.NET MVC web applications on a shared server. This library provides implementations of security algorithms. If a problem with any of the security algorithms is discovered, a newer version of the library must be created and deployed. Application downtime during the update must be minimized. As a responsible developer, you need to ensure that the new version of the library will be used by all applications as soon as possible. What should you do?

A. Build the web applications and include the security assembly as an embedded resource. When an update is needed, copy the new assembly to the bin directory for the application.
B. Install the security assembly in the Global Assembly Cache (GAC). When an update is needed, update the assembly in the GAC.
C. Build the security assembly as a netmodule in a shared location. Use the assembly linker to merge the netmodule into the assemblies for the application. When an update is needed, update the netmodule in the shared location.
D. Sign all assemblies in each application with the same key used to sign the security assembly. When an update is needed, create a new key pair and re-sign all assemblies.

For a complete ASP.NET MVC online test and Practice Exams, Click Here.

Correct Answers: B

Following are the different available options to pass data from a Controller to View in ASP.NET MVC along with Introduction and Background:

Let’s discuss all these options step by step in this series.

Introduction

If we want to maintain state between a Controller and corresponding View– ViewData and ViewBag are the available options but both of these options are limited to a single server call (meaning it’s value will be null if a redirect occurs). But if we need to maintain state from one Controller to another (redirect case), then TempData is the other available option.

It’s common that initially it might be a bit difficult for a ASP.NET WebForms developer to digest above flow and need for options to pass data from Controller to View. Because in WebForms approach, Controller and View are tightly coupled to each other. Please follow the link for a detailed comparison of the differences between ASP.NET WebForms and ASP.NET MVC here.

For the purpose of implementation, we will take earlier ASP.NET MVC tutorial on this blog as base and implement with different options. If you haven’t gone through the article, please read “Building your first ASP.NET MVC application in 4 simple steps” first.

ViewBag Example

As we discussed earlier that ViewBag and ViewData serves the same purpose but ViewBag is basically a dynamic property (a new C# 4.0 feature) having advantage that it doesn’t have typecasting and null checks.
So, In order to pass data from Controller to View using ViewBag, we will modify our EmployeeController code as follows:

public class EmployeeController : Controller
{
       // GET: /Employee/
       public ActionResult Index()
       {
         ViewBag.EmployeeName = "Muhammad Hamza";
         ViewBag.Company = "Web Development Company";
         ViewBag.Address = "Dubai, United Arab Emirates";                     
 
         return View();
       }
}

public class EmployeeController : Controller

{

// GET: /Employee/

public ActionResult Index()

{

ViewBag.EmployeeName = "Muhammad Hamza";

ViewBag.Company = "Web Development Company";

ViewBag.Address = "Dubai, United Arab Emirates";

return View();

}

And to get Employee details passed from Controller using ViewBag, View code will be as follows:

<body>
  <div>
     <h1>Employee (ViewBag Data Example)</h1>
     <div>
            <b>Employee Name:</b> @ViewBag.EmployeeName<br />
            <b>Company Name:</b> @ViewBag.Company<br />
            <b>Address:</b> @ViewBag.Address<br />
     </div>
 </div>
</body>

<body>

<div>

<h1>Employee (ViewBag Data Example)</h1>

<div>

<b>Employee Name:</b> @ViewBag.EmployeeName<br />

<b>Company Name:</b> @ViewBag.Company<br />

<b>Address:</b> @ViewBag.Address<br />

</div>

</body>

In order to see the above changes in action run the solution, we will find the following output.

ViewData Example

As compared to ViewBag, ViewData is a dictionary object which requires typecasting as well as null checks. Same above implementation using ViewData can be achieved as follows:

public class EmployeeController : Controller
{
     // GET: /Employee/
     public ActionResult Index()
     {
           ViewData["EmployeeName"] = "Muhammad Hamza";
           ViewData["Company"] = "Web Development Company";
           ViewData["Address"] = "Dubai, United Arab Emirates";                     
 
           return View();
     }
 }

public class EmployeeController : Controller

{

// GET: /Employee/

public ActionResult Index()

{

ViewData["EmployeeName"] = "Muhammad Hamza";

ViewData["Company"] = "Web Development Company";

ViewData["Address"] = "Dubai, United Arab Emirates";

return View();

}

And to get Employee details passed from Controller using ViewBag, View code will be as follows:

<body>
    <div>
          <h1>Employee (ViewBag Data Example)</h1>
          <div>
            <b>Employee Name:</b> @ViewData["EmployeeName"]<br />
            <b>Company Name:</b> @ViewData["Company"]<br />
            <b>Address:</b> @ViewData["Address"]<br />
          </div>
    </div>
</body>

<body>

<div>

<h1>Employee (ViewBag Data Example)</h1>

<div>

<b>Employee Name:</b> @ViewData["EmployeeName"]<br />

<b>Company Name:</b> @ViewData["Company"]<br />

<b>Address:</b> @ViewData["Address"]<br />

</div>

</body>

Run the application to view the following output.

Hopefully, this ASP.NET MVC Tutorial will provide reader with a better understanding of passing data from Controller to View in ASP.NET MVC using ViewBag and ViewData. Please follow the link for detailed understanding about Using TempData in ASP.NET MVC.

Top Courses on ASP.NET MVC and related

Learn ASP NET MVC 5 step by step [Maruti Makwana, Corporate Trainer] 28 Lectures, 2.5 Hours Video, Intermediate Level
Very easy to learn video series on Asp.Net MVC 5 Specially for those who are familiar with Asp.Net Web forms.
AngularJS for ASP.NET MVC Developers [Brett Romero] 10 Lectures, 1 hour video, Intermediate Level
The Fastest Way For .NET Developers To Add AngularJS To Their Resume
ASP.NET with Entity Framework from Scratch
[Manzoor Ahmad, MCPD | MCT] 77 Lectures, 10 hour video, All Level
Latest approach of web application development
Comprehensive ASP.NET MVC [3D BUZZ] 34 lectures, 14 Hours Video, All Levels
From zero knowledge of ASP.NET to deploying a complete project to production.

Let’s test your ASP.NET MVC Skill.

Please choose the correct statements about ViewBag and ViewData [Choose Two]?

A. ViewData is a Dictionary object and it requires typecasting while getting data.
B. ViewData is a Dynamic Property so it doesn’t require typecasting for getting data.
C. ViewBag is a Dictionary object and it requires typecasting while getting data.
D. ViewBag is a Dynamic Property so it doesn’t require typecasting for getting data.

For a complete ASP.NET MVC online test and Practice Exams, Click Here.

Correct Answers: A, D

More Interesting ASP.NET MVC Tutorial & More:

Top 10 Interview Questions and Answers Series:

Laurentiu LAZAR

Hi,
How to relate this with real life scenario to render several (partial) views on main view (e.g. Home Index)? I have in mind the scenario when models are EF based and pulls data from real DB tables. E.g. I have model Jobs (IdJob, Description, Title etc.) and model Candidates (IdCandidate, Description, Title etc.) and I want to render in Main View the latest Jobs and the latest Candidates. Since all scaffolded controllers and associated views work well, I am not able to produce controllers and partial views to render into Main View as I want.
- WebdevTutorial
  
  Hi Lazar,
  
  I have discussed scaffolding recently in a separate post below but it’s limited to one model:
  http://www.webdevelopmenthelp.net/2015/04/scaffolding-in-asp-net-mvc.html
  
  To render several partial views on main view, Dino Esposito has discussed the scenario of comibining multiple Partial Views together here:
  
  https://www.simple-talk.com/dotnet/asp.net/revisiting-partial-view-rendering-in-asp.net-mvc/
  
  Please read through it and reply if your issue get solved. Sharing your experience will be helpful for others too.
  - Laurentiu LAZAR
    
    Thank you. I know Dino’s post. Unfortunately much resources that we can found today on web did not take a realistic approach to subject. They are limited to simple master detail approach, but this is not difficult at all because in most cases scaffolding does most of the job (at least in most recent combination of MVC and EF). I still did not find (nor at Microsoft learning resources) something related to more real life like scenarios (I have in mind for example a Dashboard where we have to display data from various unrelated models)
  - Laurentiu LAZAR
    
    Hi,
    I found somehow a solution but still not working perfect: now I am able to use in a view data from a various number of models (in my test was 3), it works as standalone view, but I need to render this in _Layout (or in another main view of my application), and this don’t work: it throws exception about for example Jobs not found or defined in model (but if I try the view itself, as I said, it works)
    - WebdevTutorial
      
      Hi Lazar,
      I understand your requirement. I’ll work on it to come up with some solution in a separate post in near future.
      In the meantime, if you find an appropriate solution, please do share with us as it will be helpful for others.
      
      I really appreciate your feedback and concern.
      Thanks.