How to post the selected value of a selectlist to the controller using a view model?

Question

This question has been asked in various forms but none of the answers seem to fit my situation. I am simply trying to retrieve the selected value of a dropdown list in my controller.

Here is my code:

ViewModel.cs

public class ViewModel
{
  public ViewModel() {}
  public ViewModel(Contact contact, IEnumerable<State> states)
    {
      this.Contact = contact;
      this.States = new SelectList(states, "Id", "Name", contact.StateId);
    }
  public Contact Contact {get;set;}
  public SelectList States {get;set;}
}

Controller.cs

[HttpPost]
public ActionResult Edit(ViewModel viewModel)
{
  _contactService.UpdateContact(viewModel.Contact);
  return RedirectToAction("Item", new {id = viewModel.Contact.Id});
}

View.cshtml

<button type="submit" onclick="javascript:document.update.submit()"><span>Update</span></button>//aesthic usage. 
@{using (Html.BeginForm("Edit", "Controller", FormMethod.Post, new { name = "update" }))
  {
   @Html.HiddenFor(m => m.Contact.Id)
   @Html.LabelFor(m => m.Contact.Name, "Name:")
   @Html.TextBoxFor(m => m.Contact.Name)

   <label for="state">State:</label>
   @Html.DropDownList("state", Model.States)
}
}

Everything works as expected except that no values from the dropdownlist are passed in my posted viewModel to the controller. The edit page and all fields load correctly. The dropdowns bind correctly and have their selected values displayed properly. However, when I post I only get a "Contact" object passed to the controller. The "States" SelectList object is null.

I tried mapping a "StateId" property in my viewModel contstructor but that did not work either. What am I doing wrong?

Thanks.

score 3 · Accepted Answer · edited May 23 '17 at 12:17

I hate answering my own questions but based on the multiple issues I had coupled with the myriad of answers available I thought I would summarize my findings.

First off thanks for Filip, his answer did not exactly fix my problem but it led me in the right direction. +1

If you are creating a form for viewing and editing that requires a drop down list, here are some suggestions and gotchas. I will start with a list of parameters that I needed to fit my needs.

Strongly typed views in my view are preferable. Minimize magic strings.
View models should contain as little logic and extraneous elements as possible. There only job should be to facilitate a collection of data objects.
The drop down list should display the selected value.
The selected value should map easily back to the view model on form submit.

This may sound like an obvious and easily obtainable list but for someone new to MVC, it is not. I will revise my code from above with comments. Here is what I did.

ViewModel.cs

public class ViewModel
{
  public ViewModel() {}
  public ViewModel(Contact contact, IList<State> states)
  {
//no need to pass in a SelectList or IEnumerable, just what your service or repository spits out
    this.Contact = contact;
    this.States = states;
  }
  public Contact Contact {get;set;}
  public IList<State> States {get;set;}
}

Controller.cs //nothing really different than above

public ActionResult Edit(int id)
{
  var contact = _contactService.GetContactById(id);
  var states = _stateService.GetAllStates();
  return View(new ViewModel(contact, states));
}

public ActionResult Edit(ViewModel viewModel)
{
  _contactService.UpdateContact(viewModel.Contact);
  return RedirectToAction("Edit", new {id = viewModel.Contact.Id });
}

View//thanks goes to Artirto at this post

@{using (Html.BeginForm("Edit", "Controller", FormMethod.Post))
 {
  @Html.HiddenFor(m => m.Contact.Id)
  @Html.DropDownListFor(m => m.Contact.StateId, new SelectList(Model.States, "Id", "Name", @Model.Contact.StateId))
<input type="submit" value="Save" />
}
}

were you clicking any button after selecting dropdownvalue or just on the selection of dropdown you wanted to do postback? — alice7, Apr 02 '12 at 18:21
Is this right approach to have a viewmodel having Contact entity? — Rohit, Jun 29 '13 at 04:13

score 2 · Answer 2 · answered Feb 09 '11 at 21:41

2

Try using @Html.DropDownListFor instead, if "state" is a part of your model you can use it like this:

@Html.DropDownListFor(m => m.Contact.StateId, Model.States, "-- Please select a State --") where m.State holds the selected value.

Also not to confuse the IEnumerable with the Model, I would put that in the ViewBag / ViewData.

It would look something like this instead:

@Html.DropDownListFor(m => m.Contact.StateId, (IEnumerable<string>)ViewBag.States, "-- Please select a State --")

And in your action that returns this view you will need to initialize the State enumerable to the ViewBag.States property.

answered Feb 09 '11 at 21:41

Filip Ekberg

36,033
20
126
183

I have used the ViewBag and it worked as expected but it just sort of seems like another mini viewmodel. For the sake of argument based on the code I posted, why would the select lists come back null when they are a part of the view model? – trevorc Feb 09 '11 at 22:08
Because in your model you want a `SelectList` and that's not what the form will post. If you add a `string` parameter on you action named "state", it should get the value you selected. – Filip Ekberg Feb 09 '11 at 22:11

How to post the selected value of a selectlist to the controller using a view model?

2 Answers2

Linked