title: Asp.Net MVC 4 - Binding to complex object not working in POST
body: <p>I have a view model that looks like this:</p>
  
  <pre><code> public class EventVm
      {
          public int Id { get; set; }
          public int GroupId { get; set; }
          public string Title { get; set; }       
          public EventLayout EventLayout { get; set; }
      }
  </code></pre>
  
  <p>EventLayout is a custom object that looks like this:</p>
  
  <pre><code>public class EventLayout
  {
      private const string SingleColumnLayoutLocalKey = "MyOrg.SingleColumnLayout";
      ...
      //Removed for breviety
  
      public static EventLayout SingleColumnLayout = new EventLayout(SingleColumnLayoutLocalKey);
      ...
      //Removed for breviety
  
      public string Value
      {
          get { return _layoutLocalKey; }
      }
  
      private readonly string _layoutLocalKey;
  
      private EventLayout(string layoutLocalKey)
      {
          _layoutLocalKey = layoutLocalKey;
      }
  
      public static EventLayout LayoutFromLocalString(string localString)
      {
         ...
      }
  
      public override string ToString()
      {
          return _layoutLocalKey;
      }
  
      public override bool Equals(object obj)
      {
          if (obj.GetType() != this.GetType())
          {
              return false;
          }
          if (this._layoutLocalKey == obj.ToString())
          {
              return true;
          }
          return false;
      }
  
      public override int GetHashCode()
      {
          return this._layoutLocalKey.GetHashCode();
      }
  }
  </code></pre>
  
  <p>Basically EventLayout is just a custom enumeration that provides string backing store. EventLayout is bound to a Select form control (T() is just a localization extension method):</p>
  
  <pre><code>&lt;select id="eventLayoutSelect" name="EventVm.EventLayout"&gt;
      @foreach (var option in Model.EventLayoutOptions)
      {
          &lt;option value="@option.Value" @((Model.EventLayout != null &amp;&amp; Model.EventLayout.Equals(option))
                                              ? "selected=selected" 
                                              : string.Empty)&gt;@T(option.Value)&lt;/option&gt;
      }
  &lt;/select&gt;
  </code></pre>
  
  <p>When I POST this form to the server, EventVm.EventLayout property is null when the action attempts to bind. However I can see that an EventLayout instance is POSTed in the form data:</p>
  
  <p><img src="https://i.stack.imgur.com/NWKZ3.png" alt="enter image description here"></p>
  
  <p>My action looks like this:</p>
  
  <pre><code> [HttpPost]
      public ActionResult Update(EventVm eventVm)
      {
          _eventService.UpdateEvent(eventVm);
          return RedirectToAction("Index", new { groupId = eventVm.GroupId }); 
      }
  </code></pre>
  
  <p>Can someone tell me what I've done wrong please?</p>