Getting Multiple Selected Values in Html.DropDownlistFor

user picture user · Aug 29, 2012 · Viewed 63k times · Source
@Html.DropDownListFor(m => m.branch, CommonMethod.getBranch("",Model.branch), "--Select--", new { @multiple = "multiple" })

@Html.DropDownListFor(m => m.division, CommonMethod.getDivision(Model.branch,Model.division), "--Select--", new { @multiple = "multiple" })

I have two instances of DropDownListFor. I want to set selected as true for those which have previously stored values for Model.branch and Model.division. These are string arrays of stored ids

class CommonMethod
{
    public static List<SelectListItem> getDivision(string [] branchid , string [] selected)
    {
        DBEntities db = new DBEntities();
        List<SelectListItem> division = new List<SelectListItem>();
        foreach (var b in branchid)
            {
                var bid = Convert.ToByte(b);
                var div = (from d in db.Divisions where d.BranchID == bid select d).ToList();
                foreach (var d in div)
                {
                    division.Add(new SelectListItem { Selected = selected.Contains(d.DivisionID.ToString()), Text = d.Description, Value = d.DivisionID.ToString() });
                }
            }
        }

        return division;
    }
}

The returned value of division is selected as true for the selected item in the model, but on view side it is not selected.

Answer

Darin Dimitrov picture Darin Dimitrov · Aug 29, 2012

Use a ListBoxFor instead of DropDownListFor:

@Html.ListBoxFor(m => m.branch, CommonMethod.getBranch("", Model.branch), "--Select--")

@Html.ListBoxFor(m => m.division, CommonMethod.getDivision(Model.branch, Model.division), "--Select--")

The branch and division properties must obviously be collections that will contain the selected values.

And a full example of the proper way to build a multiple select dropdown using a view model:

public class MyViewModel
{
    public int[] SelectedValues { get; set; }
    public IEnumerable<SelectListItem> Values { get; set; }
}

that would be populated in the controller:

public ActionResult Index()
{
    var model = new MyViewModel();

    // preselect items with values 2 and 4
    model.SelectedValues = new[] { 2, 4 };

    // the list of available values
    model.Values = new[]
    {
        new SelectListItem { Value = "1", Text = "item 1" },
        new SelectListItem { Value = "2", Text = "item 2" },
        new SelectListItem { Value = "3", Text = "item 3" },
        new SelectListItem { Value = "4", Text = "item 4" },
    };

    return View(model);
}

and in the view:

@model MyViewModel
...
@Html.ListBoxFor(x => x.SelectedValues, Model.Values)

It is the HTML helper that will automatically preselect the items whose values match those of the SelectedValues property.