Difference Between ViewBag, ViewData and TempData in MVC with an example

Introduction:

How to Create Web API in ASP.Net MVC

                                    




Asp.Net MVC provides three ways to pass or store the data between the controllers and views. Or we can say purpose of these three are same. View Data is nothing but it works as a object of dictionary type and its values access on the basis of by using keys. ViewData is used to pass data from controller to view. ViewBag same as ViewData. ViewBag is also used to pass data from the controller to its appropriate view. It is dynamic property (dynamic key is introduced in .NET Framework 4.0).

Let's start with practically step by step. 

First create an ASP.NET application with given wizard.




After define the name of this project, Click on OK button. Then given below window will open.



Again click on OK button. Project takes some times for load the some files which is already created by visual studio, after that add a controller. Click on Controller -> Select Add ->Controller.
After that a simple wizard will open like. 



Provide controller name "CheckDemo " and then click on Add button. After that create an Action Method which name is "SayHello" which contains the information which will pass in view available in controller.
For passing the information from controller to view here we will use View data. 

Here view data contains values like:

ViewData["username"] = name

To show the value using ViewData we need to add View.

 Add View: Right click on view and click Add View like, 

After that view shows like this.



After that I have write some message like. 

1. @{  
2.     ViewBag.Title = "SayHello";  
3. }  
4.   
5. <h2>Hi, @ViewData["username"].ToString() Welcome to first MVC Application.</h2>  

Here I have to type cast ViewData into string because it returns an object of ViewDataDictionary type. 

Now I will execute my application. Then an error will come like this:  

Because we must have to pass controller name and actionresult name and its parameter, here we pass controller name and ActionResult name and its parameter like this: 


will be show After that output like.



View Data:

1. ViewData is used to pass data from controller to view
2. It is an object of ViewDataDictionary type. It contains the value like array notation.
3. It is available for the current request only
4. Requires typecasting for complex data type and checks for null values to avoid error
5. If redirection occurs, then its value becomes null

ViewBag: 

It is a wrapper for viewdata. It performs same functionality but it is a dynamic property that takes advantage of the new dynamic features in C# 4.0. It is dot(.) notation . It does not need to type  cast.ViewBag is alos used to pass data from the controller to respective view.

It's also available for the current request only. Does not require typecasting for complex data type

Same ActionResult I used ViewBag like. 

1. namespace ViewbagVsViewDataVsTempData.Controllers  
2. {  
3.     public class CheckDemoController : Controller  
4.     {  
5.       public ActionResult SayHello(string id)  
6.         {  
7.             //ViewData["username"] = id;  
8.             ViewBag.usertname = id;  
9.             return View();  
10.         }  
11.     }  
12. } 

And view is like that. 

1. @{  
2.     ViewBag.Title = "SayHello";  
3. }  
4.   
5. @*<h2>Hi, @ViewData["username"].ToString() Welcome to first MVC Application.</h2>*@  
6.   
7. <h2>.usertname  Welcome Hi, @ViewBag to first MVC Application.</h2>  

Output:

TempData: 

It is used for passing data from one controller to another controller or one request to other request. TempData contains the data until target is completely loaded. TempData is a dictionary object that is derived from TempDataDictionary class and stored in short live sessions.

It is also needs to type cast 

For TempData I create some actionresult like and view. Here we store the data in TempData for passing one controller to another controller. 

Code

1. public ActionResult CreateForm()  
2.       {  
3.           return View();  
4.       }  
5.   
6.       [HttpPost]  
7.         public ActionResult CreateForm(string id)  
8.       {  
9.           TempData["username"] = id;  
10.           return RedirectToAction("ShowMessage");  
11.       }  

Add view of CreateForm Controller: 

Code:

1.    @{  
2.     ViewBag.Title = "CreateForm";  
3. }  
4.   
5. <h2>Create User</h2>  
6.   
7. @using (Html.BeginForm()) {   
8.   
9.     <div>  
10.         <input id="name" type="text"/>  
11.         <p><input id="btncreate" type="submit" value="Create"> </p>  
12.      </div>  
13. }  

This view shows like this:

Those values enter this textbox that value stores in TempData and shows tempdata value in other ActionResult(ShowMessage) view.

 

And Add Another Action result here for showing the TempData stored value.

1. public ActionResult ShowMessage()  
2. {  
3.     return View();  
4. } 

View :

1. @{  
2.     ViewBag.Title = "ShowMessage";  
3. }  
4.   
5. <h2>Hi, @TempData["username"].ToString()  Welcome to first MVC Application using TempData.</h2>  

Output:

The first time completely load view with TempData, after that tempdata is lost. For checking  it when we refresh a page then we get an error like: 

This error proves completely loaded TempData;  after that data is lost.

Conclusion
MVC provide three ways to bind the data from controller to controller and controller to view: ViewData, ViewBag and TeampData for passing data from controller to view and in a request. ViewData and ViewBag are similar to each other and transfer the data from controller to view,  where as temp data requires typecasting for complex data type and checks for null values to avoid error.