SelectList does not select items when generated inside View - asp.net-mvc

Question

I am having problems to preselect the items when creating SelectList inside View. Here is the Razor code:
#{
ViewBag.Title = "RoleGroupMappings";
}
<h2>Map roles to groups:</h2>
<table>
#foreach (var role in Model.Roles)
{
<tr>
<td>
<p>#role.RoleName: </p>
</td>
<td>
#using (Html.BeginForm("MapGroupsToRole", "Role", FormMethod.Post))
{
#Html.AntiForgeryToken()
#Html.Hidden("RoleId", role.RoleId)
#Html.DropDownList("Groups", new SelectList(role.Groups, "GroupId", "GroupName", role.Groups.Where(g => g.Mapped).Select(g => g.GroupId)), new { #class = "directory-groups", multiple = "multiple", style = "display: none;" })
<input type="button" value="Clear All" class="btn btn-danger clear-selection" />
<input type="submit" value="Save Changes" class="btn btn-success save-mappings" />
}
</td>
</tr>
}
</table>
Does anybody know what is the problem here?

Answer 1

I think you want to be using a MultiSelectList instead of the normal SelectList. Try this:
#Html.DropDownList("Groups", new MultiSelectList(role.Groups, "GroupId", "GroupName", role.Groups.Where(g => g.Mapped).Select(g => g.GroupId)), new { #class = "directory-groups", multiple = "multiple", style = "display: none;" })
Update
Being as this is working for me here, I'll show you how I've setup this test project. Hopefully that will help you to narrow down what the problem is. Test model setup:
public class Role
{
public int RoleId { get; set; }
public string RoleName { get; set; }
public List<Group> Groups { get; set; }
}
public class Group
{
public Guid GroupId { get; set; }
public string GroupName { get; set; }
public bool Mapped { get; set; }
}
The view model:
public class TestViewModel
{
public List<Role> Roles { get; set; }
}
public ActionResult Index()
{
var model = new TestViewModel
{
Roles = new List<Role>
{
new Role
{
RoleId = 1,
RoleName = "Test",
Groups = new List<Group>
{
new Group
{
GroupId = new Guid("12345678-1234-1234-1234-123412341234"),
GroupName = "Group 1",
Mapped = false
},
new Group
{
GroupId = new Guid("12345678-5678-6789-1234-123412341234"),
GroupName = "Group 2",
Mapped = true
},
new Group
{
GroupId = new Guid("12345678-0000-6789-1234-123412341234"),
GroupName = "Group 3",
Mapped = true
}
}
}
}
};
return View(model);
}
My view is the same as yours, except with using MultiSelect and I also removed #class = "directory-groups" and the display: none; style. Both group 2 and group 3 have their Mapped property set to true. This is the result from loading the view:

Answer 2

I found a problem in my controller. I was setting the ViewBag.Groups to some values, and obviously it was interfering with my DropDownList which had the same name. Sorry for that, I was staring whole day and I could not find the error, so I become little desperate. I should have looked at my controller, too.