Blazor (ASP.NET Core) - Cascading DropDownList
In this video , we are going to create a cascading dropdown list in Blazor using Entity Framework Core database first approach. We will create two dropdown list – Country and City. On selecting the value from country dropdown, we will change the value of City dropdown.
Steps:
=========
Creating Tables:
We will be using two tables to store our data.
Country: – Used to store the name of Country. It contains two fields – CountryId and
CountryName.
Cities: – This contains the list of cities for the Countries we insert in Country table. It contains three
fields – CityId, CountryId and CityName. The CountryId column is a foreign key reffering to
CountryId in Country table.
Scaffolding the Model to the Application
We are using Entity Framework core database first approach to create our models. We will create
our model class in BlazorDDL.Shared project so that it can be accessible to both client and server
project.
Creating Data Access Layer for the Application
We have defined two methods
GetAllCountries – It will fetch all the country data from the country table.
GetCityData – It will fetch the city data corresponding to the country id provided to it.
Adding the web API Controller to the Application
We will call the methods of DataAccessLayer class to fetch data and pass on the data to the client
side.
blazor dropdown
blazor dropdown list
blazor dropdown menu
blazor dropdown selected value
blazor dropdown from list
blazor drop down list
blazor bootstrap dropdown
blazor dropdown list example
dropdownlist in blazor
blazor dropdown from database
#blazortrain #blazortraining #blazorreportviewer #blazortutorials