title: POSTing a complex Dictionary to Controller
body: <p>I am attempting to post the following type to my controller.</p>
  
  <p><strong>Model</strong></p>
  
  <pre><code>public class EmailNotificationSettings
  {
      public string EmailHost { get; set; }
      public string EmailPassword { get; set; }
      public int EmailPort { get; set; }
      public string EmailSender { get; set; }
      public string EmailUsername { get; set; }
      public bool Enabled { get; set; }
      public bool EnableUserEmailNotifications { get; set; }
      public string RecipientEmail { get; set; }
      public Dictionary&lt;NotificationType, NotificationMessageContent&gt; Message { get; set; }
  }
  </code></pre>
  
  <p><strong>NotificationType</strong></p>
  
  <pre><code>public enum NotificationType
  {
      NewRequest,
      Issue,
      RequestAvailable,
      RequestApproved,
      AdminNote,
      Test,
  }
  </code></pre>
  
  <p><strong>NotificationMessageContent</strong></p>
  
  <pre><code>public class NotificationMessageContent
  {
      public string Subject { get; set; }
      public string Body { get; set; }
  }
  </code></pre>
  
  <p>Now all of the properties are part of my form except <code>Message</code>.
  Here is how I plan to populate <code>Message</code></p>
  
  <p><strong>View</strong></p>
  
  <pre><code>&lt;label for="newRequestSubject" class="control-label"&gt;New Request Subject&lt;/label&gt;
  &lt;div&gt;
      &lt;input type="text" class="form-control form-control-custom " id="newRequestSubject" name="newRequestSubject" value="@Model.Message.FirstOrDefault(x =&gt; x.Key == NotificationType.NewRequest).Value.Subject"&gt;
  &lt;/div&gt;
  
  &lt;label for="newRequestBody" class="control-label"&gt;New Request Body&lt;/label&gt;
  &lt;div&gt;
      &lt;input type="text" class="form-control form-control-custom " id="newRequestBody" name="newRequestBody" value="@Model.Message.FirstOrDefault(x =&gt; x.Key == NotificationType.NewRequest).Value.Body"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Javascript to Post</strong></p>
  
  <pre><code> $('#save').click(function (e) {
          e.preventDefault();
  
          var newRequestObj = {
              "Subject": $('#newRequestSubject').val(),
              "Body": $('#newRequestBody').val()
          };
          var message = { 'NewRequest': JSON.stringify(newRequestObj) };
  
          var $form = $("#mainForm");
          var data = $form.serialize();
  
          data = data + "&amp;" +JSON.stringify(message);
  
          $.ajax({
              type: $form.prop("method"),
              data: data,
              url: $form.prop("action"),
              dataType: "json",
              success: function (response) {
                 // Do something
              }
          });
      });
  </code></pre>
  
  <p>Now this is obviously the wrong way to do it as my <code>Message</code> property is not getting populated.</p>
  
  <p>Any idea how I can POST to the controller and it update my model?</p>
  
  <p><strong>Controller if you want to see (Using NancyFX)</strong></p>
  
  <pre><code>private Response SaveEmailNotifications()
  {
      var settings = this.Bind&lt;EmailNotificationSettings&gt;();
      // settings.Message doesn't contain the new values
  }
  </code></pre>