title: MVC4 Not Posting Object With Nested Recursive Lists
body: <p>I'm done tearing my hair out, so I'm asking for help.  I've build a short recursive HTML Helper to display a list of lists.  I want to return any edits back to the controller.  The child of a child keeps coming back null.  When I remove the recursion and just force through a 2nd layer of a "for loop", it seems to work.  Any clue?  I'm about to throw in the towel on RAZOR and just learn to do all this in Jquery...</p>
  
  <p>Based on my code, the problem resides here when the model is posted back (you'll see this in the comments in the post ActionResult method):</p>
  
  <p>Node.Name is ok</p>
  
  <p>Node.Children[0].Name is ok</p>
  
  <p>Node.Children[1].Name is ok</p>
  
  <p>Node.Children[1].Children = null (HERE LIES THE PROBLEM!)</p>
  
  <p>CONTROLLER CODE</p>
  
  <pre><code>       public ActionResult Y()
      {
          Node driverTree = new Node() { Name="Level1", Children = new List&lt;Node&gt;() };
          driverTree.Children.Add(new Node() { Children = null, Name = "Level2A" });
          driverTree.Children.Add(new Node() {Name ="Level2B", Children = new List&lt;Node&gt; {new Node{Name="Level3A", Children=null},
                                                                                   new Node{Name="Level3B", Children=null}}
          });
          return View(driverTree);
      }
      [HttpPost]
      public ActionResult Y(Node Node)
      {
          //Keeps returning:
              // Node.Name is ok
              // Node.Children[0].Name is ok
              // Node.Children[1].Name is ok
              // Node.Children[1].Children = null (HERE LIES THE PROBLEM!)
          int x = 5; // 
          return View();
      }
  }
  
  public class Node
  {
      public string Name { get; set; }
      public List&lt;Node&gt; Children { get; set; }
      public bool IsChecked { get; set; }
  }
  </code></pre>
  
  <p>VIEW CODE</p>
  
  <pre><code>@model JqueryUITests.Controllers.Node
  @section Scripts {
  @Scripts.Render("~/bundles/jqueryval")
  &lt;script src="../../Scripts/jquery-ui-1.10.3.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="../../Scripts/jquery-ui.unobtrusive-2.1.0.min.js" type="text/javascript"&gt;&lt;/script&gt;
  }
  
  @helper ShowTree(List&lt;JqueryUITests.Controllers.Node&gt; children)
  {
  &lt;ul&gt;
      @for (int i = 0; i &lt; children.Count;i++ )
      {
          &lt;li&gt;
              @Html.EditorFor(x =&gt; children[i].Name)
              @if (children[i].Children != null)
              {
                  @ShowTree(children[i].Children)
              }
          &lt;/li&gt;
      }
  &lt;/ul&gt;
  }
  @using (Html.BeginForm())
  {
  &lt;ul id="tree"&gt;
      &lt;li&gt;
          @Html.EditorFor(x=&gt;Model.Name)
          @ShowTree(Model.Children)
      &lt;/li&gt;
  &lt;/ul&gt;
  &lt;p&gt;
      &lt;input type="submit" value="Create" /&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p>}</p>
  
  <p>HTML CODE</p>
  
  <pre><code>&lt;form action="/X/Y" method="post"&gt;    &lt;ul id="tree"&gt;
      &lt;li&gt;
          &lt;input class="text-box single-line" id="Name" name="Name" type="text" value="Level1" /&gt;
              &lt;ul&gt;
          &lt;li&gt;
              &lt;input class="text-box single-line" id="children_0__Name" name="children[0].Name" type="text" value="Level2A" /&gt;
          &lt;/li&gt;
          &lt;li&gt;
              &lt;input class="text-box single-line" id="children_1__Name" name="children[1].Name" type="text" value="Level2B" /&gt;
  &lt;ul&gt;
          &lt;li&gt;
              &lt;input class="text-box single-line" id="children_0__Name" name="children[0].Name" type="text" value="Level3A" /&gt;
          &lt;/li&gt;
          &lt;li&gt;
              &lt;input class="text-box single-line" id="children_1__Name" name="children[1].Name" type="text" value="Level3B" /&gt;
          &lt;/li&gt;
  &lt;/ul&gt;
          &lt;/li&gt;
  &lt;/ul&gt;
  
      &lt;/li&gt;
  &lt;/ul&gt;
  &lt;p&gt;
      &lt;input type="submit" value="Create" /&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p></p>