The most frequently posted question in the ASP.NET MVC forums is about how to use the DropDownList (DDL) helper. To address this question, I wrote the tutorial Using the DropDownList Helper with ASP.NET MVC, which covers most DropDownList scenarios. This blog post shows some of the highlights of my new Using the DropDownList Helper with ASP.NET MVC tutorial. This new tutorial starts with the completed Music Store tutorial project.
The DDL doesn’t provide one common UI requirement: how do you insert new categories into the DDL? The image below shows the completed project, which allows you to insert new genres and artists into the Music Store DB.
The tutorial also shows how to use the terrific Harvest Chosen jQuery plugin to make multiple selection easy and intuitive. You can either make multiple selections, or add selections one by one. Once you add a selection, it’s removed from the dropdown. The interface makes it easy to remove a selection; all you do is click on the “x”.
The tutorial shows how to explicitly pass the SelectList to the DDL. It also demonstrates a frequently hit quirk in the ASP.NET MVC framework when using the SelectList, and how to work around it.
In the sample, you navigate to the Cascading DDL URL and you are presented a list of countries.
Once you select a country (Canada is selected in the image below), a second DDL appears with the states that belong to the selected country. All this work is done asynchronously with jQuery, so you don’t have server post back and a flickering screen.
Once you select a state, the Submit button becomes visible.
I continually work on improving these tutorials as I receive feedback. Let me know how you like them, and please send me any problems you find.
Rick.Anderson at Microsoft.com