MVC 5 Multiselect List Values Not Binding to Model On Post

Question

I have a view with several multiselect lists which are declared like this

<div class="col-md-6">
    @Html.LabelFor(model => model.Counties, htmlAttributes: new { @class = "control-label" })
    @Html.ListBoxFor(model => model.Counties, new MultiSelectList(ViewBag.CountyList, "Value", "Text"), htmlAttributes: new { @class = "form-control", size = 8, tabindex = 26 })
    @Html.ValidationMessageFor(model => model.Counties, "", new { @class = "text-danger" })
    <span class="small">Ctrl + click to select multiple items</span>
</div>

My view model contains a declaration like this:

 public virtual List<long> Counties { get; protected set; }

My action looks like this:

    [HttpPost]
    public ActionResult Edit(TScholarshipView model, FormCollection form)
    {
        if (ModelState.IsValid)
        {
            TScholarship scholarship = Repo.GetScholarship(model.Id);
            scholarship = Mapper.Map<TScholarshipView, TScholarship>(model, scholarship);
            Repo.SaveOrUpdate(scholarship, HttpContext.User.Identity.Name);

            return RedirectToAction("Edit", "AdminScholarship", new { id = model.Id });
        }

        return View("Scholarship", model);
    }

On submit I can look at the post data sent by the browser and it is sending the appropriate data to the server

...&Counties=16&Counties=34&...

When the action begins to execute the value of Counties in the model is null. However I can look at the FormCollection values and the value of form["Counties"] is "16,34". Any ideas why the binding is not occurring?

score 1 · Accepted Answer · answered May 25 '16 at 19:42

1

I noticed this right after I posted the question. The problem was having the setter protected. This prevented the binder from setting the value of the list.

answered May 25 '16 at 19:42

John Sully

281
4
9

score 0 · Answer 2 · edited May 23 '17 at 11:44

You need to reset the value of ViewBag.CountyList on post event as well.

Or have one property in the model and bind that property to your multi select list box. Something like

Wrapper / Model

public class CustomerList
{
    public List<Customer> Customers { get; set; }
    public List<int> SelectedIDs { get; set; }
}

Controller

[HttpGet]
public ActionResult DisplayCustomer()
{
    Customer oCustomer = new Customer();
    List<Customer> CustomersList = new List<Customer>();
    CustomersList.Add(new Customer() { ID = 1, Name = "TestCustomer1", Amt = 123 });
    CustomersList.Add(new Customer() { ID = 2, Name = "TestCustomer2", Amt = 234 });
    CustomersList.Add(new Customer() { ID = 3, Name = "TestCustomer3", Amt = 324 });
    ViewBag.CustList = CustomersList;
    return View(new CustomerList() { Customers = CustomersList }); 

}

[HttpPost]
public void DisplayCustomer(List<int> selectedIds)
{
    // do something with the id list
}

View

@model MvcApplication2.Models.CustomerList

@using (Html.BeginForm(@Model.SelectedIDs))
{
    @Html.ListBoxFor(m => m.SelectedIDs, new MultiSelectList(@Model.Customers, "ID", "Name", @Model.SelectedIDs))
    <input type="submit" value="save" />
}

As mentioned here

Hope that works!!!

MVC 5 Multiselect List Values Not Binding to Model On Post

2 Answers2