Pass an Array from Controller to View in ASP.Net MVC

In this article, we are going to illustrate how to pass an array from a controller to a view. For this purpose, we will use a static array that has 4 elements. You can, however, get the data from a database, from a file, or from user input to populate the Array.

How to pass an Array from Controller to View using ASP.Net MVC

I’m gonna skip all the step to create an ASP.MET MVC application, assuming you already know how to do so. Now let’s add an Employees Model to our solution as shown below.

Add the model

 public class EmployeeModel
    {
        public string Name { get; set; }
        public string Department { get; set; }
    }

Pass the array from the Controler to the View

Now it’s time to change the controller to accommodate our requirements. We will create a Generic List of the type EmployeeModel, the add few records to it. Again, you can have your own function to populate that list in any way you like.

After adding records to the list, convert the List into an array, then assign its value to a ViewBag Employees.

The controller should look like something similar to the code below

  public IActionResult Index()
        {
            Array array;
            List<EmployeeModel> employees = new List<EmployeeModel>();
            // Add first record
            employees.Add(new  EmployeeModel
            {  

               
                Name =  "Scott",
                Department ="IT"
            });
            // Add second employee
            employees.Add(new EmployeeModel
            {


                Name = "Maria",
                Department = "IT"
            });
            // add third employee
            employees.Add(new EmployeeModel
            {

                Name = "Ronald",
                Department = "HR"
            });
            //Convert the list to array and assign its value to the array variable
            array = employees.ToArray();
            // Asssign the value of the array to a Employees ViewBag 
            ViewBag.Employees = array;

            return View();
        }

The View

In the view, we will loop through the array that was passed from the controller and show its content inside an HTML table. Your code should look like something similar to the below:

@using TutorialPanel.Models;
@{
    ViewData["Title"] = "Home Page";
}

<div class="text-center">
    <h1  >Pass Array from Controller to View in ASP.Net MVC DEMO</h1>
    <table cellpadding="0" cellspacing="0" class="table">
        <thead>
            <tr>
                <th scope="col" >Name</th>
                <th scope="col">Department</th>
            </tr>
        </thead> 
        @foreach (EmployeeModel employee in (EmployeeModel[])ViewBag.Employees)
        {
            <tr>
                <td>@employee.Name</td>
                <td>@employee.Department</td>
                 
            </tr>
        }
    </table>

</div>

Now run the application

Result