Various Ways For Passing Data to View in Web API

Introduction

This article describes the possible ways to send Data from a Controller to a View. Here we use the three ways for passing the data.

  • ViewBag
  • ViewData
  • TempData

ViewBag:  A ViewBag is used for passing data from a controller to a view. It is a dynamic feature of C#. ViewBag does require typecasting at the time of passing the object to the class.

ViewData: A ViewData is also used for passing data from the controller to the view. The ViewData property of any controller describes the instance of the ViewDataDictionary class. It uses the keyvalue for passing the data and it has a need for typecasting.

TempData: TempData is a dictionary that is derived from the TempDataDictionary class.The tempData Dictionary object persists only from one request to the next. You can mark one or more keys for retention using the keep method.

Example of the application.

Step 1

Create a Web API application as in the following:

  • Start Visual Studio 2012.
  • From the start window select "Installed" -> "Visual C#" -> "Web".
  • Select "ASP.NET MVC4 Web Application" and click on the "OK" button.

    m.jpg
  • From the "MVC4 Project" window select "Web API".

    m1.jpg
  • Click on the "OK" button.

Step 2

Create Model Class:

  • In the "Solution Explorer".
  • Right-click on the Model folder.
  • Select "Add" -> "Class".
  • Select "Installed" -> "Visual C#" and select class.

    m3.jpg
  • Click on the "Add" button.
     

Add the following code:

  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.ComponentModel.DataAnnotations;  
  6. namespace MultipleAPI.Models  
  7. {  
  8.     public class User  
  9.     {  
  10.         public String Name { getset; }  
  11.         public String Address { getset; }  
  12.     }  
  13. } 

Step 3

Create a Controller:

  • In the "Solution Explorer".
  • Right-click on the Controller folder.
  • Select "Add" -> "Controller" and change the name.

    m2.jpg
  • Click on the "OK" button.

Add the following code:

  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.Mvc;  
  6. using MultipleAPI.Models;  
  7. namespace MultipleAPI.Controllers  
  8. {  
  9.     public class UserController : Controller  
  10.     {  
  11.         //  
  12.         // GET: /User/  
  13.         public ActionResult Show()  
  14.         {  
  15.             MultipleAPI.Models.User obj = new MultipleAPI.Models.User();  
  16.             obj.Name = "Tayna Sharma";  
  17.             obj.Address = "Lucknow";  
  18.             ViewBag.User = obj;  
  19.             ViewData["obj"] = obj;  
  20.             TempData["obj"] = obj;  
  21.             return View("Show");  
  22.         }  
  23.     }  
  24. } 

Step 4

Create a View.

  • In the "UserController".

  • Right-click on the "Show" Action method.

  • m4.jpg

    m5.jpg 
  • Select "Add View" and click on the "Add" button.

Add the following code:

  1. @model MultipleAPI.Models.User  
  2. @{  
  3.     Layout = null;  
  4. }  
  5. <!DOCTYPE html>  
  6. <html>  
  7. <head>  
  8.     <title>Show</title>  
  9. </head>  
  10. <body>  
  11.     <div>  
  12.     @{  
  13.         var ViewBagValue = ViewBag.User;  
  14.         var ViewDataValue =(MultipleAPI.Models.User) ViewData["obj"];  
  15.         var TempDataValue = (MultipleAPI.Models.User)TempData["obj"];  
  16.     }  
  17.      Name is :-  @ViewBagValue.Name<br/>  
  18.      Name is:-  @ViewDataValue.Name <br />  
  19.      Name is:-  @TempDataValue.Name <br />  
  20.      Address :-  @ViewBagValue.Address<br/>  
  21.      Address:-  @ViewDataValue.Address <br />  
  22.      Address:-  @TempDataValue.Address <br />  
  23.     </div>  
  24. </body>  
  25. </html>   

Step 5

Execute the application and change the URL as http://localhost:2669/User/Show

m6.jpg