ASP.NET

Different Ways To Bind DropDownList In MVC

Nowadays MVC is popular so I decided to write an article on it looking at its importance.

Create a new ASP.NET MVC Solution, then DropDownBinding as a name of solution.

Webapplication

Select Empty Template and also select View engine as Razor.

ASP.NET Empty website

Add New Controller in Controller Folder.

Controller

Add a View.

Add a View

Add view

Way 1: Dropdown Binding in View -Inline

  1. @Html.DropDownList("Techonolgie", new List < SelectListItem > ()  
  2. {  
  3.     new SelectListItem()  
  4.     {  
  5.         Text = ".Net", Value = "0"  
  6.     },  
  7.     new SelectListItem()  
  8.     {  
  9.         Text = "Java", Value = "1"  
  10.     },  
  11.     new SelectListItem()  
  12.     {  
  13.         Text = "Javascript", Value = "2"  
  14.     },  
  15.     new SelectListItem()  
  16.     {  
  17.         Text = "Angular", Value = "3"  
  18.     },  
  19.     new SelectListItem()  
  20.     {  
  21.         Text = "WCF", Value = "4"  
  22.     }  
  23. }, "-- Select --")  
Binding in View

When we run the application the output should be like the following,

run the Application

Way 2: Dropdown Binding using View Bag
  1. public ActionResult Index()  
  2. {  
  3.     List < SelectListItem > listTechonolgies = new List < SelectListItem > ()  
  4.     {  
  5.         new SelectListItem()  
  6.             {  
  7.                 Text = ".Net", Value = "0"  
  8.             },  
  9.             new SelectListItem()  
  10.             {  
  11.                 Text = "Java", Value = "1"  
  12.             },  
  13.             new SelectListItem()  
  14.             {  
  15.                 Text = "Javascript", Value = "2"  
  16.             },  
  17.             new SelectListItem()  
  18.             {  
  19.                 Text = "Angular", Value = "3"  
  20.             },  
  21.             new SelectListItem()  
  22.             {  
  23.                 Text = "WCF", Value = "4"  
  24.             }  
  25.     };  
  26.     ViewBag.Techonolgie = listTechonolgies;  
  27.     return View();  
  28. }  
Dropdown Binding

In View,

View

select technology

Way 3: Using Model Class

Right lick on Model Folder Add, then TechnologiesModel.cs - Class 

Class

Add the following two classes,
  1. public class TechnologiesList  
  2. {  
  3.     public SelectList lstTechnologies  
  4.     {  
  5.         get;  
  6.         set;  
  7.     }  
  8. }  
  9. public class Technologie  
  10. {  
  11.     public int ID  
  12.     {  
  13.         get;  
  14.         set;  
  15.     }  
  16.     public string TechnologieName  
  17.     {  
  18.         get;  
  19.         set;  
  20.     }  
  21. }  
Namespace

The Controller code should look like the following,
  1. public ActionResult Index()  
  2. {  
  3.     List < Technologie > list = new List < Technologie > ();  
  4.     list.Add(new Technologie()  
  5.     {  
  6.         TechnologieName = ".Net", ID = 0  
  7.     });  
  8.     list.Add(new Technologie()  
  9.     {  
  10.         TechnologieName = "Javascript", ID = 2  
  11.     });  
  12.     list.Add(new Technologie()  
  13.     {  
  14.         TechnologieName = "Angular", ID = 3  
  15.     });  
  16.     list.Add(new Technologie()  
  17.     {  
  18.         TechnologieName = "WCF", ID = 4  
  19.     });  
  20.     TechnologiesList TList = new TechnologiesList();  
  21.     TList.lstTechnologies = new SelectList(list, "ID", "TechnologieName", 2);  
  22.     return View(TList);  
  23. }  
Select list
  1. @model DropDownBinding.Models.TechnologiesList  
  2.   
  3. @{  
  4.     Layout = null;  
  5. }  
  6.   
  7. <!DOCTYPE html>  
  8.   
  9. <html>  
  10. <head>  
  11.     <meta name="viewport" content="width=device-width" />  
  12.     <title>Index</title>  
  13. </head>  
  14. <body>  
  15.     <div>  
  16.         <label>  
  17.             Select Technologie  
  18.         </label>  
  19.         @Html.DropDownList("Tech",Model.lstTechnologies,"--Select--")  
  20.     </div>  
  21. </body>  
  22. </html>  
code

run

In the next article we are going discuss about how to bind drop down list using database with Entity frame work.

 

Up Next
    Ebook Download
    View all
    Learn
    View all
    Get Started

    You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.

    Become a sharper developer and jumpstart your career.

    Basic

    $0

    $

    . 00

    monthly

    For Basic members:

    • Standard Profile
    • Access learning courses
    • Access free e-books
    • 1x point
    Premium

    $20

    $

    . 00

    monthly

    For Premium members:

    • Earn 2x reward points
    • Premium profile with Verified check
    • Premium Avatar with status update
    • Learning courses
    • Unlimited Certifications and badges on profile
    • Unlimited Book downloads
    • Access to Premium content
    • Online Training
    • Unlimited PDF conversions and downloads
    • Professional Resume Writing
    • Interview Preparations Guide
    • 25 messages per month
    • 1 "Kodzu" avatar, basic
    Elite

    $45

    $

    . 00

    monthly

    For Elite members:

    • Bundle E-books
    • Access to all Learn Series
    • Unlimited Apply Jobs