How to have current value from database selected in DropDownListFor

Question

I have a Shop model:

public class Shop
{
    public int ShopId { get; set; }

    [Display(Name = "Winkel")]
    public string Name { get; set; }

    public virtual ICollection<Category> Categories { get; set; }
}

And a model for the Weekday:

public class WeekDay
{
    public int WeekDayId { get; set; } // Integers from 0 to 6 where Sunday is 0 and Saturday 6
                                 // so that it maps with the DayOfWeek enumeration
    [Required]
    [Display(Name = "Dag")]
    public string Day { get; set; }

    public int? ShopId { get; set; }
    public virtual Shop Shop { get; set; }
}

Now my goal is to display the seven days with next to them a dropdownlist with the possible shops to choose from. I want to be able to show the current shop that belongs to the day selected in a Html.DropDownList(For) currently selected in the dropdownlist. The next and final step is to be able to click a button and save all the currently selected values and update the WeekDay table in the database, which looks like this:

WeekDayId    ShopId    Day
1            NULL      Zondag
2            1         Maandag
3            1         Dinsdag
4            1         Woensdag
5            1         Donderdag
6            2         Vrijdag
7            NULL      Zaterdag

To do this I made the following ViewModel:

public class ShopWeekDayViewModel
{
    public IEnumerable<Shop> ShopItems { get; set; }
    public List<WeekDay> WeekDays { get; set; }
}

And then in the view I display the different WeekDays with the Shops as follows:

@model ViewModels.ShopWeekDayViewModel

<table>
@foreach (var weekDay in Model.WeekDays)
    {
        <tbody>
            <tr>
                <td>
                   @Html.DisplayFor(d => weekDay.Day)
                </td>
                <td>
                    @Html.DropDownListFor(m => weekDay.Shop.ShopId, 
                        new SelectList(Model.ShopItems, 
                                     "ShopId", 
                                     "Name", 
                                     Model.ShopItems), 
                      "")
                </td>
            </tr>
        </tbody>
    }
</table>

Now the current value (from the database - so the actual shop that is currently connected with the weekday) in the DropDownListFor is not selected, and I do not know how to accomplish this goal. I hope someone can help me with this.

Answer 1

Try this:

@Html.DropDownListFor(m => weekDay.Shop.ShopId, 
    new SelectList(Model.ShopItems, 
        "ShopId", 
        "Name", 
        weekDay.Shop.ShopId)
)

The last parameter to the SelectList constructor is an object which represents the selected value. Currently, you're passing in an IEnumerable for that parameter, which doesn't make any sense as you want to select a single value. Also notice that I'm using weekDay.Shop.ShopId, instead of Model.Shop.ShopId, in order to reference the Shop that belongs to the current WeekDay.

Answer 2

You are setting your SelectList selected value to your list of items.

Change it to use a different overload an dnot have a selected value

new SelectList(Model.ShopItems, "ShopId", "Name")

So you view becomes:

@model ViewModels.ShopWeekDayViewModel

<table>
@foreach (var weekDay in Model.WeekDays)
    {
        <tbody>
            <tr>
                <td>
                   @Html.DisplayFor(d => weekDay.Day)
                </td>
                <td>
                    @Html.DropDownListFor(m => weekDay.Shop.ShopId, 
                        new SelectList(Model.ShopItems, 
                                     "ShopId", 
                                     "Name"))
                </td>
            </tr>
        </tbody>
    }
</table>