Create DROPDOWNS in ASP.NET Core using DropDownList and GetEnumSelectList!

welcome to this video my name is Yannick from tutorial CU and today I'm going to teach you how you can create drop downs in asp.net core MVC from simple list data just like that maybe something you have fetched from your database or alternatively from an enum and we will get started with the enum here and at the second part of the video we will take a look on how you can create it from any kind of collection so let's get started [Music] so here I have created a very simple enum it's called e-rolled and we have four roles in total default sales manager and admin so now let's see how we can bring that into a nicely looking and working drop down since we're using asp.net core MVC right here I will switch to the default home controller and inside of the index view action that we have right here you can see that we are returning a view so I want to go to My Views folder open up the home folder for the home controller and then we got the indexes HTML I'm going to open that up and now right here I will just remove the default welcome text and I will just insert that drop down which we can now create using the add HTML drop down list helper at HTML dot drop down list now first parameter we can give it a name let's write down role now let's add a comma jump to the next line here and then we again use HTML Dot and now get enum select list including the type right here and now simply write down the name of your enum which is for me e-rolls now for sure at the parenthesis like this because it's a method next up we can add an optional label let's call it select role for example and now finally we can add another comma and add some HTML so let's create a new object here so new object add class to apply some CSS classes and we will simply use form control it's for sure bootstrap making that field look a little bit nice I want to add a small form label so what I'm going to do is I just add a label here and I call it roll and I will just add a CSS class so that it looks a little bit nicer than form label there we go awesome so this is what we have to do now let's take a look at it perfect so here we got our drop down and if I click on that you can see that the select list pops up including all of our enum values perfect so this is one out of two scenarios but what happens if you don't have an enum what if you want to create a drop down from simple values let's say for example you are getting some data from a database including five or six values and you want to create a drop down from that now let's take a look at how you can implement this but before we continue make sure to like this video and to subscribe to our channel so that you no longer miss any of our upcoming videos which help you to become a better cshop programmer and also if you really want to become a.net hero you should check out our c-sharp progress Academy where you will learn everything you need to know about asp.net core angular unit testing and software design patterns so you can find the link in the description below or popping up in the info card right now this course is really your best way to massively boost your c-sharp skills and your software development expertise okay now let's get to the second scenario where we don't have that enum let me just close that instead we have some simple data Maybe fetched from a database or something like that inside of a typical list or array so let me real quick create some data here so there we go this is our new list of type string called roles there you go and to prove that it's working I just added a new row which is called director so that we can see the difference between the enum and the actual primitive list that we got right here okay so now we have to bring in this list into our view but I don't want to bind it to the model just like that so that's not what I want to do because maybe you don't want to do that too instead I want to put this information into the view back so I can simply call The View back right here let's say view back door rolls equals to and now we don't simply put that roles list into the view back now instead we will create a new select list just give it a second to load hover above it and import the namespace which is required using Microsoft asp.net core MVC rendering now we add the parentheses and simply put in the collection from which we want to create that select list in our scenario we want to put in the roles list that we have right here now you could also put in some data which you have fetched from your database using Entity framework that would be fine too you can also create a select list from that for sure great let's save it like this let's switch over to our indexes HTML and the only thing that we have to change here is that HTML get enum select list now instead of calling it and grabbing well the data from that enum we simply want to use our view back here so viewback dot rows because viewback dot roles you cannot see it because it's not bound because it's Dynamic right but you can see that it is a select list so roads is a select list and that's why it's compiling fine now open up the application let's click on that you can see default sales manager and you can also see director which proves that we have created that drop down from a simple select list which we have created from a collection awesome I hope you found that video helpful if you like it make sure to give it a thumb up and to subscribe to our Channel and if you want to become a.net hero check out our c-sharp progress Academy you can find the link in the description below to master asp.net angular test driven development and software design patterns so thanks for watching and I see you back in the next video [Music]

Channel: tutorialsEU - C#

Views: 9,698

Keywords: dotnet, csharp, dotnet core, .net core tutorial, .net core, .net, c#, Tutorials, Tutorial, Programming, Course, Learn, Step by step, guide, programmer, core, code, c sharp, sharp, net6, 6.0, .net framework, programming, visual studio, programming for beginners, coding, how to code, dot net, c# programming, tim corey, software development, c# asp dropdown selectlist, mvc, dropdownlist, mvc dropdownlist, dropdown, asp.net mvc, asp.net dropdownlist, asp.net mvc tutorial, asp.net core

Id: pigM1PojI0Q

Length: 6min 14sec (374 seconds)

Published: Tue Nov 29 2022