Artist / Album dropdowns on edit page

May 11, 2011 at 7:19 AM


I would like to modify the edit page so that a user can input a value for "Artist" and "Album" if it is not available on the drop down. Then this value would be saved to the DB just as if they had chosen a value from the drop down.

Could anyone point me in the right direction on how to get this done?


May 11, 2011 at 9:03 PM

Sounds like a great idea. You'll need to make two changes - in the view (/Views/StoreManager/Edit.cshtml) and in the controller action which handles updates from the Edit form submit (/Controllers/StoreManagerController.cs - Edit(Album album)).

  • View: You'll need to change from the HTML select control to one that both shows the available genres and allows for entering new ones. One option is the jQueryUI AutoComplete control in ComboBox mode:
  • Action: That will take a little more work, since I think entering a new Genre may fail model validation. You'll need to detect a new Genre, save it, update the Album based on the new Genre ID, and save it.

This is an interesting exercise - if I can find some time, I'll blog it and update this with the code.

May 12, 2011 at 2:39 AM

Thanks for the direction. I will try to get this set up as you described over the next few days. If I succeed, I'll post the code here.


Jun 6, 2011 at 2:39 AM


Wondering if you have had a chance to try implementing this exercise.

I have set up the UI changes with the combobox, but I am stuck on how to update the Genre class with the new entry. Since the 'Create' and 'Edit' views are strongly typed to the Album class, what is the best way to access the Genre class from within this view and add a new Genre.

I could create a new view strongly typed to Genre and add new Genres there, then return to the Album "Create" or "Edit" views and use the newly-added  Genre, but it would be much nicer to be able to do everything in one view.

Thanks for any hints you can provide on this.



Jun 19, 2011 at 11:19 PM

I'd be pretty stoked to see this as an additional tutorial too! Just getting into MVC and your tut is awesome! I'm trying to create my own blog app and this is basically where I'm stuck.. instead of genre I'm calling categories, but as u say, the validation is a bit tricky and keeps preventing me from saving. I've even stripped everything but the blog title, and the category to try to figure it out, but I'm such a newb I just don't know enough C# or LINQ yet. The best I've managed to pull off created the categories inside the blog table so I knew then I was heading away from the solution.

Hope you get some time for this one!

Thanks again for the great tut and project!

Jun 25, 2011 at 12:02 AM

I haven't done this yet - I'll try to do it next week.

Jun 25, 2011 at 12:08 AM

Thanks Jon! I'd be glad to offer some kind of donation for your time if it helps at all... I'm sure this tut is helping a ton of people get into MVC3.

Jun 25, 2011 at 2:19 AM
Edited Jun 25, 2011 at 2:25 AM

I came up with a workaround for this scenario, but would love to hear some other solutions too...

The combobox doesn't allow any text to be entered that isn't part of the underlying list, so I left that part as is and added a small link below it that says "Artist not in list? Add a new one here." This opens up a modal (I used jQuery colorbox) that sources in the ArtistManager/Create/ view that is strongly typed to Artist (I used the scaffolding feature to create an ArtistManager controller).

When the artist is added and the modal closes a callback function axaj-refreshes the combobox dropdown to include the newly added Artist in the list.

I also separated the Artist combobox & underlying DropDownList into it's own Partial View and wrote it's own controller that returns the refreshed Select list when the callback ajax .load() call is made to it.

So it would still be nicer if the user could add and select a new Artist at the same time through the ui, but this 2-step process seems to work ok for now.