title: ASP.Net MVC C# two viewmodels within another viewmodel - how to reference in the view
body: <p>I'm trying to follow suggested best practice, by using ViewModels.</p>
  
  <p>In my forum app, I want to post a list of posts, and at the bottom of the screen, add a textbox so replies can be posted.</p>
  
  <p>So in my mind, I need a ViewModel for the Posts list, and a ViewModel for the Reply to be posted (TopicId and Content).</p>
  
  <p>Therefore, I think I need to combine these two ViewModels together in a third ViewModel, and in my View, iterate over the Posts part of the ViewModel, and then at the bottom, create a form, where I have the Reply part of the ViewModel - and the Postback sends just the ReplyViewModel to the controller.</p>
  
  <p>My ViewModels are:</p>
  
  <pre><code> public class PostViewModel
  {
      public int PostId { get; set; }
      public string Title { get; set; }
      public string Description { get; set; }
      public string Author { get; set; }
      public DateTime DateOfTopic { get; set; }
  }
  
  public class ReplyViewModel
  {
      public int TopicId { get; set; }
      public string Content { get; set; }
  }
  
  public class PostListAndReplyVM
  {
      public List&lt;PostViewModel&gt; PostViewModel { get; set; }
      public ReplyViewModel ReplyViewModel { get; set; }
  }
  </code></pre>
  
  <p>In my controller I populate the PostViewModel, then create an empty ReplyViewModel, then combine them in a PostListAndReplyVM:</p>
  
  <pre><code>//
      // GET: /Post/List/5
      public ActionResult List(int id = 0)
      {
          // Populate PostViewModel
  
          var post = db.Posts.Include(x =&gt; x.Topic)
                .Select(p =&gt; new PostViewModel
                {
                    PostId = p.TopicId,
                    Title = p.Title,
                    Description = p.Content,
                    DateOfTopic = p.DateOfPost,
                    Author = p.Author
                }
               ).ToList();
  
          // Populate empty ReplyViewModel
  
          ReplyViewModel prvm = new ReplyViewModel();
          prvm.Content = "";
          prvm.TopicId = id;
  
          // Combine two viewmodels into a third, to send to the controller
  
          PostListAndReplyVM pvm = new PostListAndReplyVM();
          pvm.ReplyViewModel = prvm;
          pvm.PostViewModel = post;
  
          // Return combined ViewModel to the view
  
          return View(pvm);
      }
  </code></pre>
  
  <p>Then in my view I have:</p>
  
  <pre><code>@model IEnumerable&lt;centreforum.Models.PostListAndReplyVM&gt;
  
  &lt;table class="table table-condensed table-striped table-hover table-bordered"&gt;
  &lt;tr&gt;
      &lt;th&gt;
          @Html.DisplayNameFor(model =&gt; model.PostId)
      &lt;/th&gt;
  ....
  ....
  @foreach (var item in Model) {
  &lt;tr&gt;
      &lt;td&gt;
          @Html.DisplayFor(modelItem =&gt; item.PostId)
      &lt;/td&gt;
  </code></pre>
  
  <p>How do I refer to the two separate ViewModels within the <strong>PostListAndReplyVM</strong> posted to the view. eg. if I think it should be something like:</p>
  
  <pre><code>@Html.DisplayFor(modelItem =&gt; itemitem.PostViewModel.PostId)
  </code></pre>
  
  <p>...but that gives the error:</p>
  
  <p><strong>'centreforum.Models.PostListAndReplyVM' does not contain a definition for 'PostId' and no extension method 'PostId' accepting a first argument of type 'centreforum.Models.PostListAndReplyVM' could be found</strong> </p>
  
  <p>And for the list part:</p>
  
  <pre><code>@foreach (var item in Model.PostViewModel) 
  </code></pre>
  
  <p>...gives an error of:</p>
  
  <p><strong>'System.Collections.Generic.IEnumerable' does not contain a definition for 'PostViewModel' and no extension method 'PostViewModel' accepting a first argument of type 'System.Collections.Generic.IEnumerable' could be found</strong></p>
  
  <p>I'm sure I'm missing something simple - thanks for any help,</p>
  
  <p>Mark</p>