Web Programming TutorialsLearn ViewData ViewBag and TempData in MVC

Learn ViewData ViewBag and TempData in MVC

MVC2In previous topic, you have learnt about MVC design pattern, Today what we are going to learn in MVC is that, how to pass data from one page to another means from controller to view, controller to controller or controller to action

In Asp.Net MVC ViewData, ViewBag and TempData is used to pass data from controller to view, controller to controller or controller to action. ViewData and ViewBag are almost same and TempData performs some additional functionality. ViewData is a dictionary object derived from ViewDataDictionary and is accessed by string key. ViewBag is similar to ViewData but the difference is ViewBag is a dynamic property means type casting is not required while fetching data. ViewData and ViewBag is used to transfer data from controller to corresponding view.

TempData is derived from TempDataDictionary class which means it is a dictionary. TempData is string key and object value. It stores the data for the time span of HTTP request means only from one page to another page.

TempData internally use Session variable. If we want to keep value in TempData object after reading we use TempData.Keep() method and to access value we use TempData.peek() method.

ViewData

  • ViewData is a dictionary object derived from ViewDataDictionary and is accessed by string key.
  • ViewData is used to transfer data from controller to view.
  • Type casting is required while fetching data from ViewData.

ViewBag

  • ViewBag is similar to ViewData except it is a wrapper around the ViewData object that allows you to create dynamic property.
  • ViewData is used to transfer data from controller to view.
  • Type casting is not required while fetching data from ViewData.

TempData

  • TempData is a property of ControllerBase class.
  • TempData is derived from TempDataDictionary
  • Type casting is required while fetching data from TempData.
  • TempData is used to transfer data from current request to subsequent request means controller to controller, controller to action or controller to view.

Now in following example we will see how to implement view data, view bag and temp data using MVC. Open the visual studio 2012 and later and create a new Asp.net MVC application from file menu.
Select empty template from project template and press ok button.
1
You can see that our MVC design pattern is ready, let make our model class by right clicking on Models from solution explorer.

Example:
Model
In the below code we have created a User class with some properties defined.

/*Model*/  
namespace Users.Models
{
    public class User
    {
        public string Name { get; set; }
        public string Email { get; set; }
        public long Phone { get; set; }
    }

}

Controller
Now going forward to controller, right click to Controllers in solution explorer and click on add controller pop up box. It will ask for controller name
2
Give controller name by replacing the highlighted text and remain Controller text as it is. Click on add button
You can see now your controller is ready.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace Users.Controllers
{
    public class UserController : Controller
    {
        //
        // GET: /User/

        public ActionResult Index()
        {
            return View();
        }

    }
}

Now moving forward we need to assign our users model in controller add name spaces of your model in controller.

 Using Users.Models;

So now in the action result method we have declared ViewData, ViewBag and TempData and assigned User object value to them.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Users.Models;

namespace Users.Controllers
{
    public class UserController : Controller
    {
                public ActionResult Index()
        {
            var UserDetail = new User
            {
                Name = "Test Name",
                Email = "[email protected]",
                Phone = 123456789,

            };
            // ViewBag & ViewData, TempData
            ViewData["UserData"] = UserDetail;
            ViewBag.UserData = UserDetail; //dynamic property
            TempData["UserData"] = UserDetail;

            return View();

        }

    }
}

View
TO add View, right click on Action Result method and click on Add view
3

In view we used them for displaying value in browser. As we can see ViewBag is a dynamic property type casting is not required.

@using Users.Models;
@{    
    ViewBag.Title = "Home Page";
    var viewDataUser = ViewData["UserData"] as User;
    var tempDataUser = TempData["UserData"] as User;                
}
<h2>Welcome @ViewBag.UserData.Name !</h2>
    <div>
        
        <br />
        <h4>View Bag  :- @ViewBag.UserData.Name</h4>
        <h3>View Data :-  @viewDataUser.Name</h3>
        <h2>Temp Data :- @tempDataUser.Name</h2>
    </div>

Our view is ready to Test the example, go to App_start and in route.config , add controller name and action  name

defaults: new { controller = "user", action = "Index", id = UrlParameter.Optional }

Learn HTML5 Programming For Beginners

Output
Let run this programme, we can see the values which were assigned to ViewBag, ViewData and TempData is displayed in web browser.
4

IN case, you need to keep the data in TempData after reading, as we know temp data clear out after completion of subsequent request.

That means temp data is store between two consecutive request and not accessible on third request. To keep temp data after subsequent request/redirection, In that case we can use TempData.Keep() method and to access value we can use TempData.peek() method.

Let’s understand the concept of temp data by following diagram.
5

As you seen in above piece of code we have saved the user detail in temp data as first request, no in following second request is used to fetch data from temp data
6

So data is available till the completion of second request, it will become null on third request.
7

In order to keep the data after compilation of second request, just add keep method
8

Output
9

Summary:
ViewBag, ViewData and TempData are not state persistence mechanisms, but they are part of State Management: they are mechanisms for passing data from controller to view, controller to controller or controller to action. If we want to pass data from controller to view we use ViewBag and ViewData, if we want to transfer data from controller to action or controller to controller we use TempData

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Exclusive content

- Advertisement -

Latest article

21,501FansLike
4,106FollowersFollow
106,000SubscribersSubscribe

More article

- Advertisement -