Binding DropDown List Using Tuple In ASP MVC

In this article, we are going to learn how to bind drop-down list using Tuple in ASP MVC.

 

Before that, we should know wha Tuple is and what is the usage of a tuple.

 

What is Tuple? 

 

Tuple is a generic static class that was added to C# 4.0 and it can hold any amount of elements, and they can be any type we want. So using a tuple, we can return multiple values.One great use of tuple might be returning multiple values from a method. It provides an alternative to "ref" or "out" if you have a method that needs to return multiple new objects as part of its response.

A tuple allows you to combine multiple values of possibly different types into a single object without having to create a custom class. This can be useful if you want to write a method that for example returns three related values but you don't want to create a new class.

 

To know more about Tuple, please refer Here

 

Let's see the step by step process to implement Binding drop down using Tuple,

 

Step 1

 

Let's create a simple mvc project in Visual studio. To do -> go to Visual Studio -> select File -> New - > Project -> click-> a new dialog window will open

 

Select "web" in the left pane and select "ASP.NET Web Application"  main window.Then give a name for your project and click ok. Here, I have named my project as "BindingDropDownUsingTuple".

 

Now, a new dialog window will appear again. In that, select MVC and click ok.

 

Please find the below images for your references. 

 

 

 

 

 

 

Step 2

 

Once the project has been created, you can see more folders in the solution file.

 

 

 

Step 3 

 

Next, let's create a simple class under models folders. Here, I have created a class and named it as "SchoolModels".

 

 

 

 

Here's the sample code for your reference.

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

namespace DropDownBindingUsingTuple.Models
{
    public class Departments
    {
        public int DeptId { get; set; }
        public string DeptName { get; set; }
    }

    public class Students
    {
        public int StudentId { get; set; }
        public string StudentName { get; set; }
    }
}

Explanation of View Model

 

Here, I have created two classes such as "Departments" and "Students". The Departments class is used to bind the Department drop-down list and Students class is used to bind the Students' drop-down list.

 

Step 4

 

Next, let's create a simple controller under Controllers folder. Here, I have created a simple controller and named it as "SchoolController". 

 

 

 

 

Step 5

 

Let's create a "Departments" and "Students" list to bind it to the drop-down list. Just add the below code in your index method.

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


namespace DropDownBindingUsingTuble.Controllers
{
    public class SchoolController : Controller
    {
        // GET: SchoolDetails
        public ActionResult Index()
        {
            List<Departments> DeptList = new List<Departments>();  //List of Departments
            List<Students> StudentList = new List<Students>();   // List of Students
            DeptList.Add(new Departments
            {
                DeptId=1,
                DeptName="BCA"
            }); //adding list to DeptList Object
            DeptList.Add(new Departments
            {
                DeptId = 2,
                DeptName = "BSC"
            });
            DeptList.Add(new Departments
            {
                DeptId = 3,
                DeptName = "MCA"
            });
            StudentList.Add(new Students
            {
               StudentId=1,
               StudentName="Ramesh"
            }); // adding list to StudentList Object
            StudentList.Add(new Students
            {
                StudentId = 2,
                StudentName = "Kannan"
            });
            StudentList.Add(new Students
            {
                StudentId = 3,
                StudentName = "Vimal"
            });
            List<SelectListItem> DeptListNew = new List<SelectListItem>();  // Creating SelectListItem List
            List<SelectListItem> StudentListNew = new List<SelectListItem>();
            DeptListNew = DeptList.Select(x => new SelectListItem
            {
                Text=x.DeptName,
                Value=x.DeptId.ToString()
            }).ToList(); //Binding DeptList to SelectListItem DeptListNew
            StudentListNew = StudentList.Select(x => new SelectListItem
            {
                Text = x.StudentName,
                Value = x.StudentId.ToString()
            }).ToList(); //Binding StudentList to SelectListItem StudentListNew
            var TubleList = Tuple.Create<List<SelectListItem>,List<SelectListItem>>(DeptListNew,StudentListNew); //creating Tuple and passing two select list item in that.
            return View(TubleList); //passing Tuple to view.
        }
    }
}

Step 6

 

Next, let us create a simple View for our Index action result. To create a View, right-click Index action result -> Add View -> just click OK.

 

Please find the below image and code for your reference.

 

@model Tuple<List<SelectListItem>,List<SelectListItem>>
@{
    ViewBag.Title = "Index";
}
<h2>Index</h2>
@Html.DropDownList("DeptValue",Model.Item1, "Select","")  @*Getting Tuple first list using Model.Item1*@
<br />
<br />
<br />
@Html.DropDownList("StudValue", Model.Item2, "select", "")  @*Getting Tuple second list using Model.Item2*@

Step 7

 

Run the application and see the expected result. Please find the sample result below.