ASP.NET MVC - Passing Data From Controller To View

Introduction

There are many ways to pass Model class data to the View using a Controller class. In this article, I'm showing how to pass the data from Controller to View by using a simple example. Thus, let’s start and flip to your Visual Studio 2015.

Method 1 to pass data to View

Step 1. Give a name to your empty ASP.NET Web Application and click the OK button.

I don’t want to use a full MVC-based solution. The article is based on a simple example, so just select an Empty template.

Step 2. Add a Model class by right-clicking on the Models folder under Solution.

Step 3. Select a class and give a name to your class.

Just type a few words of the code snippet for automatically implementing property and press the tab button available on the keyboard two times, which is a good practice, when the code is long.

The public Record model class contains only three properties, which we want to pass to Views.

public class Record  
{  
    public int Id { get; set; }  
    public string  RecordName { get; set; }  
    public string  RecordDetail { get; set; }  
         
}  

Step 4. Add a controller class by right-clicking on the Controllers folder.

Step 5. Select an Empty Controller from the list of Scaffold.

Step 6. Give a meaningful name to your Controller.

The controller is ready now. By using ViewBag, we can pass the data from Controller to View.

Note. ViewBag gets the dynamic view data dictionary. 

Step 7. Create an object of your Model class and resolve it by namespace.

I have created an object of the model class and assigned it to in ViewBag data dictionary. Assign the value for the property based on the model class. 

public ActionResult Index()  
{  
    Record rec = new Record  
    {  
        Id = 101,  
        RecordName = "Bouchers",  
        RecordDetail = "The basic stocks"  
    };  
    ViewBag.Message = rec;  
    return View();  
} 

  Step 8. Add a View for an Index Action by right-clicking on it.

Step 9. Give a name to it and select the Add button.

First of all, import the model class.

Assign viewbag into a variable and all the properties will be in place, using the variable and Razor block. 

@using PassDatainMVC.Models  
  
@{  
    ViewBag.Title = "Index";  
}  
  
<h3>Passing Data From Controller to View using ViewBag</h3>  
@{   
    var data = ViewBag.Message;  
}  
<h3>Id: @data.Id</h3>  
<h3>RecordName: @data.RecordName</h3>  
<h3>RecordDetail: @data.RecordDetail</h3>

  Step 10. Build and run your Application. You will get ViewBag Data.

Method 2 to pass data to View

The other way of passing the data from Controller to View is ViewData. Also, a dictionary-type object is similar to ViewBag. There are no huge changes in Controller, and ViewData contains key-value pairs.

public ActionResult Index()  
{  
    Record rec = new Record  
    {  
        Id = 101,  
        RecordName = "Bouchers",  
        RecordDetail = "The basic stocks"  
    };  
    ViewData["Message"] = rec;  
    return View();  
}  

Access your model class when you are using ViewData, as shown below.

@using PassDatainMVC.Models  
@{  
    ViewBag.Title = "Index";  
}  
<h3>Passing Data From Controller To View using ViewData</h3>  
@{  
    var data = (Record)ViewData["Message"];  
}  
<h3>Id: @data.Id</h3>  
<h3>RecordName: @data.RecordName</h3>  
<h3>RecordDetail: @data.RecordDetail</h3>   

Save and Run your project. You will get the expected result from the ViewData.

Method 3 to pass data to View

The other way of passing the data from Controller to View can be by passing an object of the model class to the View. Erase the code of ViewData and pass the object of the model class in return view.

public ActionResult Index()  
{  
    Record rec = new Record  
    {  
        Id = 101,  
        RecordName = "Bouchers",  
        RecordDetail = "The basic stocks"  
    };  
    return View(rec);  
}   

Import the binding object of the model class at the top of Index View and access the properties by @Model.

@using PassDatainMVC.Models  
@model PassDatainMVC.Models.Record  
@{  
    ViewBag.Title = "Index";  
}  
<h3>Passing Data From Controller To View using Model Class Object</h3>  
  
<h3>Id: @Model.Id</h3>  
<h3>RecordName: @Model.RecordName</h3>  
<h3>RecordDetail: @Model.RecordDetail</h3>  

The expected result from the Model class Object is given.

Method 4 to pass data to View

The other way of passing the data is TempData, which is responsible for storing temporary data.

 After completing the subsequent request, the TempData will be cleared out. TempData is derived from TempDataDictinory. It is very useful to transfer non-sensitive data from one action method to another action method. As you can see in the screenshot given below, I have created an Action method for checking TempData. TempData transfers the data from the CheckTempData method to the Index method.

public ActionResult CheckTempData()  
{  
    TempData["data"] = "I'm temprory data to used in subsequent request";  
    return RedirectToAction("Index");  
}   

Access TempData in Index.Chtml view is given.

<h3>Hey! @TempData["data"]</h3>

Run the Application and call the respective action method. TempData uses an internal session to store the data.

I hope you liked this article. Stay tuned with me for more on ASP.NET MVC, Web API and Microsoft Azure.