[RESOLVED]Programmatic setting 'selected' in SelectListItem not rendering

This is seriously aggravating. I’ve been working with a multi-select control via the Chosen jQuery plugin. It posts values to the server I can save, no problem. The problem comes when I need to set the values of the items that were already selected, and
send that to the view for rendering – it’s not selecting the item(s).

I even set a breakpoint at my call to the Html.DropDownListFor helper to check out the values, and my chosen SelectListItem’s selected property is set to true, so all should be good. But of course it’s not. The select element is rendered without any of the
options being selected. Can anyone explain to me why a List<SelectListItem> with one or more of the items set to Selected = true would instead set none of them to true?

I actually encountered this issue fairly recently and although I don’t have the code available at hand, I remember having to rely on the rarely seen

MultiSelectList class
as opposed to the traditional SelectList to handle setting the values within the Controller :

// Set your selected values and populate your entire MultiSelectList
ViewBag.YourOptions = new MultiSelectList(YourEntireCollection, YourEntireCollection.Where(x => YourSelectedCondition));

And then within the View, I believe I didn’t rely on the DropDownListFor() Helper and simply iterated through the values in the ViewBag :

<select id='YourPropertyName' name='YourPropertyName' class='chosen-select>
    @foreach(var item in ViewBag.YourOptions)
    {
         <option value='@item.Value' @(item.Selected ? "selected" : "")>@item.Text</option>
    }
</select>

I’ll see if I can dredge up the related code sometime tomorrow, however if timing is an issue, you might consider looking through some
similar discussions like this or

this other one
, which both rely on the ListBoxFor() Helper method as opposed to the DropDownListFor().

Looks like for Chosen you need to pass the values as array

$("#dropDownId").val(["130860","130858"]);
$("#dropDownId").selectmenu('refresh');

Please take a look at this stack overflow

http://stackoverflow.com/questions/6966260/jquery-multiselect-set-a-value-as-selected-in-the-multiselect-dropdown

An example using it for Artist Tags:

View Model:

public class ArtistViewModel
{
    public Artist artist { get; set; }
    public MultiSelectList PossibleTags { get; set; }
    public int[] SelectedTags { get; set; }
}

Controller:

public ActionResult Edit(int id)
{
    var model = new ArtistViewModel();
    model.artist = db.Artists.Find(id);
    
    if (model.artist.ArtistTags.Any())
    {
        model.PossibleTags = GetPossibleTags((from p in model.artist.ArtistTags select p.TagId).ToArray());
    }
    else
    {
        model.PossibleTags = GetPossibleTags(null);
    }

    return View(model);
}

private MultiSelectList GetPossibleTags(int[] selectedValues)
{
    return new MultiSelectList(db.Tags.OrderBy(o => o.Name).ToList(), "TagId", "Name", selectedValues);
}

View:

@Html.ListBoxFor(m => m.SelectedTags, Model.PossibleTags)

This example uses a View Model, but you should be able to figure out how to dump in in your View Bag, if so desired.  I think it would be easier if you used a View Model as this example uses.

Leave a Reply