Pass nested viewmodel in html.beginform

I have the issue that i have a viewmodel (MasterViewModel) with a nested viewmodel (ChildViewModel) and i have a dropdownlist within a form, that does an ajax post via jQuery in order to update a partial view. But no matter what i do, the childviewmodel in the Part action is always empty, and I dont understand why. Heres a simplified code example:

Controller:

Namespace MvcApplication2
    Public Class TestController
        Inherits System.Web.Mvc.Controller

        '
        ' GET: /Test

        Function Index() As ActionResult
            Dim viewModel As New MasterViewModel
            viewModel.MyId = 123
            viewModel.ChildViewModel = New ChildViewModel With 开发者_运维技巧{.Name = "woohoo"}
            viewModel.Items = New List(Of SelectListItem) From { _
                New SelectListItem With {.Text = "first", .Value = "1"},
                New SelectListItem With {.Text = "second", .Value = "2"}
            }
            viewModel.SelectedItem = New List(Of SelectListItem) From { _
                New SelectListItem With {.Text = "first", .Value = "1"}
            }
            Return View(viewModel)
        End Function

        Function Part(ByVal viewModel As ChildViewModel) As ActionResult
            viewModel.Name = viewModel.Name & "_"
            Return PartialView(viewModel)
        End Function


    End Class
End Namespace

Index View:

@ModelType MvcApplication2.MasterViewModel
@Code
    ViewData("Title") = "Index"
End Code
<script type="text/javascript" language="javascript">
    function update() {
        $('#myForm').change(function () {
            var form = $('#myForm');
            $.ajax({
                url: form.attr('action'),
                type: form.attr('method'),
                data: form.serialize(),
                success: function (result) {
                    $('#mjoo').html(result);
                }
            });
        });
    }

</script>
<h2>Index</h2>

<p>@Model.MyId</p>

@Using Html.BeginForm("Part", "Test", FormMethod.Post, New With {.id = "myForm"})

    @Html.DropDownListFor(Function(x) x.SelectedItem, Model.Items, New With {.onchange = "update()"})
    @Html.HiddenFor(Function(x) x.ChildViewModel)

End Using

<div id="mjoo">

    @Html.Partial("Part", Model.ChildViewModel)

</div>

Part view:

@ModelType MvcApplication2.ChildViewModel

<p>@Model.Name</p>

Viewmodels:

Public Class MasterViewModel
    Property ChildViewModel As ChildViewModel
    Property Items As List(Of SelectListItem)
    Property SelectedItem As List(Of SelectListItem)
    Property MyId As Integer
End Class

Public Class ChildViewModel
    Property Name As String
End Class

What might be wrong with this. I know there is something i'm missing, but I just can't see it.

---

You cannot magically stuff an entire model into a single field.
You need to make a separate hidden field for each property in the model.

I recommend moving th the entire form to a separate partial view that takes the child model to simplify the code.