Getting Multiple Selected Values in Html.DropDownlistFor

69,729

Solution 1

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.

Solution 2

For me it works also for @Html.DropDownListFor:

Model:

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

Controller:

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

    // the list of available values
    model.Values = new[]
    {
        new SelectListItem { Value = "2", Text = "2", Selected = true },
        new SelectListItem { Value = "3", Text = "3", Selected = true },
        new SelectListItem { Value = "6", Text = "6", Selected = true }
    };

    return View(model);
}

Razor:

@Html.DropDownListFor(m => m.SelectedValues, Model.Values, new { multiple = "true" })

Submitted SelectedValues in controller looks like:

enter image description here enter image description here

Share:
69,729
user
Author by

user

Updated on January 25, 2020

Comments

  • user
    user over 4 years
    @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.

    • Mohayemin
      Mohayemin over 11 years
      I don't get your question. Is it simply How to set a value selected in dropdownlist?
    • user
      user over 11 years
      Yes, I want to get the values to be selected which are stored in database previously on page load.
  • Guruprasad J Rao
    Guruprasad J Rao over 8 years
    What if I want to display all the values and then ask user to select multiple options and post multiple selected options after user submits? Is it possible with above approach.. If not could you please let me know how its done.. I could have created separate question but I feel that this answer is very near to what I want..
  • Martin Bring
    Martin Bring over 6 years
    The difference is that you already set the listitem values to selected, in Model.Values, and you do not use SelectedValues at all. Try removing "selected = true" and add some int to SelectedValues, then it does not work as expected. Not for me anyway.
  • Mantra
    Mantra over 4 years
    Did not work for me as expected by the answer. Clearly it's true what @MartinBring has pointed out. May be the answer needs little bit of editing. I don't know how it got so many up votes, wonder if they actually tried it before voting.